@next2d/webgpu 3.0.4 → 3.1.0

package/src/Filter/GlowFilter/FilterApplyGlowFilterUseCase.d.ts

@@ -7,18 +7,18 @@ import type { IFilterConfig } from "../../interface/IFilterConfig";
  * UV変換方式で元テクスチャとブラーテクスチャを直接サンプリング。
  * copyTextureToTextureと一時テクスチャを使用しない最適化版。
  *
- * @param  {IAttachmentObject} sourceAttachment - 入力テクスチャ
+ * @param  {IAttachmentObject} source_attachment - 入力テクスチャ
  * @param  {Float32Array} matrix - 変換行列
  * @param  {number} color - グロー色 (32bit整数)
  * @param  {number} alpha - アルファ
- * @param  {number} blurX - X方向ブラー量
- * @param  {number} blurY - Y方向ブラー量
+ * @param  {number} blur_x - X方向ブラー量
+ * @param  {number} blur_y - Y方向ブラー量
  * @param  {number} strength - グロー強度
  * @param  {number} quality - クオリティ
  * @param  {boolean} inner - インナーグロー
  * @param  {boolean} knockout - ノックアウトモード
- * @param  {number} devicePixelRatio - デバイスピクセル比
+ * @param  {number} device_pixel_ratio - デバイスピクセル比
  * @param  {IFilterConfig} config - WebGPUリソース設定
  * @return {IAttachmentObject} - フィルター適用後のアタッチメント
  */
-export declare const execute: (sourceAttachment: IAttachmentObject, matrix: Float32Array, color: number, alpha: number, blurX: number, blurY: number, strength: number, quality: number, inner: boolean, knockout: boolean, devicePixelRatio: number, config: IFilterConfig) => IAttachmentObject;
+export declare const execute: (source_attachment: IAttachmentObject, matrix: Float32Array, color: number, alpha: number, blur_x: number, blur_y: number, strength: number, quality: number, inner: boolean, knockout: boolean, device_pixel_ratio: number, config: IFilterConfig) => IAttachmentObject;

package/src/Filter/GlowFilter/FilterApplyGlowFilterUseCase.js

@@ -1,4 +1,5 @@
 import { $offset } from "../FilterOffset";
+import { intToPremultipliedRGBA } from "../FilterUtil";
 import { execute as filterApplyBlurFilterUseCase } from "../BlurFilter/FilterApplyBlurFilterUseCase";
 /**
  * @description プリアロケートされたFloat32Array (サイズ16)
@@ -13,15 +14,6 @@ const $entries4 = [
     { "binding": 2, "resource": null },
     { "binding": 3, "resource": null }
 ];
-/**
- * @description 32bit整数からRGB値を抽出（プリマルチプライドアルファ対応）
- */
-const intToRGBA = (color, alpha) => {
-    const r = (color >> 16 & 0xFF) / 255 * alpha;
-    const g = (color >> 8 & 0xFF) / 255 * alpha;
-    const b = (color & 0xFF) / 255 * alpha;
-    return [r, g, b, alpha];
-};
 /**
  * @description グローフィルターを適用
  *              Apply glow filter
@@ -29,29 +21,28 @@ const intToRGBA = (color, alpha) => {
  * UV変換方式で元テクスチャとブラーテクスチャを直接サンプリング。
  * copyTextureToTextureと一時テクスチャを使用しない最適化版。
  *
- * @param  {IAttachmentObject} sourceAttachment - 入力テクスチャ
+ * @param  {IAttachmentObject} source_attachment - 入力テクスチャ
  * @param  {Float32Array} matrix - 変換行列
  * @param  {number} color - グロー色 (32bit整数)
  * @param  {number} alpha - アルファ
- * @param  {number} blurX - X方向ブラー量
- * @param  {number} blurY - Y方向ブラー量
+ * @param  {number} blur_x - X方向ブラー量
+ * @param  {number} blur_y - Y方向ブラー量
  * @param  {number} strength - グロー強度
  * @param  {number} quality - クオリティ
  * @param  {boolean} inner - インナーグロー
  * @param  {boolean} knockout - ノックアウトモード
- * @param  {number} devicePixelRatio - デバイスピクセル比
+ * @param  {number} device_pixel_ratio - デバイスピクセル比
  * @param  {IFilterConfig} config - WebGPUリソース設定
  * @return {IAttachmentObject} - フィルター適用後のアタッチメント
  */
-export const execute = (sourceAttachment, matrix, color, alpha, blurX, blurY, strength, quality, inner, knockout, devicePixelRatio, config) => {
+export const execute = (source_attachment, matrix, color, alpha, blur_x, blur_y, strength, quality, inner, knockout, device_pixel_ratio, config) => {
     const { device, commandEncoder, frameBufferManager, pipelineManager, textureManager } = config;
     // 元のオフセットを保存
     const baseOffsetX = $offset.x;
     const baseOffsetY = $offset.y;
-    const baseWidth = sourceAttachment.width;
-    const baseHeight = sourceAttachment.height;
-    // ブラーフィルターを適用（元テクスチャを保持）
-    const blurAttachment = filterApplyBlurFilterUseCase(sourceAttachment, matrix, blurX, blurY, quality, devicePixelRatio, config);
+    const baseWidth = source_attachment.width;
+    const baseHeight = source_attachment.height;
+    const blurAttachment = filterApplyBlurFilterUseCase(source_attachment, matrix, blur_x, blur_y, quality, device_pixel_ratio, config);
     const blurWidth = blurAttachment.width;
     const blurHeight = blurAttachment.height;
     const blurOffsetX = $offset.x;
@@ -85,7 +76,7 @@ export const execute = (sourceAttachment, matrix, color, alpha, blurX, blurY, st
     if (!pipeline || !bindGroupLayout) {
         console.error("[WebGPU GlowFilter] Pipeline not found");
         frameBufferManager.releaseTemporaryAttachment(blurAttachment);
-        return sourceAttachment;
+        return source_attachment;
     }
     // サンプラーを作成
     const sampler = textureManager.createSampler("glow_sampler", true);
@@ -95,7 +86,7 @@ export const execute = (sourceAttachment, matrix, color, alpha, blurX, blurY, st
     // blurScale: vec2<f32>, blurOffset: vec2<f32> (16 bytes)
     // strength: f32, inner: f32, knockout: f32, _padding: f32 (16 bytes)
     // Total: 64 bytes
-    const [r, g, b, a] = intToRGBA(color, alpha);
+    const [r, g, b, a] = intToPremultipliedRGBA(color, alpha);
     $uniform16[0] = r;
     $uniform16[1] = g;
     $uniform16[2] = b;
@@ -125,7 +116,7 @@ export const execute = (sourceAttachment, matrix, color, alpha, blurX, blurY, st
     $entries4[0].resource.buffer = uniformBuffer;
     $entries4[1].resource = sampler;
     $entries4[2].resource = blurAttachment.texture.view;
-    $entries4[3].resource = sourceAttachment.texture.view;
+    $entries4[3].resource = source_attachment.texture.view;
     const bindGroup = device.createBindGroup({
         "layout": bindGroupLayout,
         "entries": $entries4

package/src/Filter/GradientBevelFilter/FilterApplyGradientBevelFilterUseCase.d.ts

@@ -9,21 +9,21 @@ import type { IFilterConfig } from "../../interface/IFilterConfig";
  *              2. ベベルベースにブラー適用
  *              3. UV変換方式で最終合成（isInsideでハード境界クリッピング）
  *
- * @param  {IAttachmentObject} sourceAttachment - 入力テクスチャ
+ * @param  {IAttachmentObject} source_attachment - 入力テクスチャ
  * @param  {Float32Array} matrix - 変換行列
  * @param  {number} distance - ベベルの距離
  * @param  {number} angle - ベベルの角度（度）
  * @param  {Float32Array} colors - 色配列
  * @param  {Float32Array} alphas - アルファ配列
  * @param  {Float32Array} ratios - 比率配列
- * @param  {number} blurX - X方向ブラー量
- * @param  {number} blurY - Y方向ブラー量
+ * @param  {number} blur_x - X方向ブラー量
+ * @param  {number} blur_y - Y方向ブラー量
  * @param  {number} strength - ベベル強度
  * @param  {number} quality - クオリティ
  * @param  {number} type - タイプ (0: full, 1: inner, 2: outer)
  * @param  {boolean} knockout - ノックアウトモード
- * @param  {number} devicePixelRatio - デバイスピクセル比
- * @param  {IGradientBevelConfig} config - WebGPUリソース設定
+ * @param  {number} device_pixel_ratio - デバイスピクセル比
+ * @param  {IFilterConfig} config - WebGPUリソース設定
  * @return {IAttachmentObject} - フィルター適用後のアタッチメント
  */
-export declare const execute: (sourceAttachment: IAttachmentObject, matrix: Float32Array, distance: number, angle: number, colors: Float32Array, alphas: Float32Array, ratios: Float32Array, blurX: number, blurY: number, strength: number, quality: number, type: number, knockout: boolean, devicePixelRatio: number, config: IFilterConfig) => IAttachmentObject;
+export declare const execute: (source_attachment: IAttachmentObject, matrix: Float32Array, distance: number, angle: number, colors: Float32Array, alphas: Float32Array, ratios: Float32Array, blur_x: number, blur_y: number, strength: number, quality: number, type: number, knockout: boolean, device_pixel_ratio: number, config: IFilterConfig) => IAttachmentObject;

package/src/Filter/GradientBevelFilter/FilterApplyGradientBevelFilterUseCase.js

@@ -1,10 +1,7 @@
 import { $offset } from "../FilterOffset";
 import { execute as filterApplyBlurFilterUseCase } from "../BlurFilter/FilterApplyBlurFilterUseCase";
 import { generateFilterGradientLUT } from "../../Gradient/GradientLUTGenerator";
-/**
- * @description 度からラジアンへの変換係数
- */
-const DEG_TO_RAD = Math.PI / 180;
+import { DEG_TO_RAD } from "../FilterUtil";
 /**
  * @description プリアロケートされたFloat32Array
  */
@@ -37,37 +34,37 @@ const $entries5 = [
  *              2. ベベルベースにブラー適用
  *              3. UV変換方式で最終合成（isInsideでハード境界クリッピング）
  *
- * @param  {IAttachmentObject} sourceAttachment - 入力テクスチャ
+ * @param  {IAttachmentObject} source_attachment - 入力テクスチャ
  * @param  {Float32Array} matrix - 変換行列
  * @param  {number} distance - ベベルの距離
  * @param  {number} angle - ベベルの角度（度）
  * @param  {Float32Array} colors - 色配列
  * @param  {Float32Array} alphas - アルファ配列
  * @param  {Float32Array} ratios - 比率配列
- * @param  {number} blurX - X方向ブラー量
- * @param  {number} blurY - Y方向ブラー量
+ * @param  {number} blur_x - X方向ブラー量
+ * @param  {number} blur_y - Y方向ブラー量
  * @param  {number} strength - ベベル強度
  * @param  {number} quality - クオリティ
  * @param  {number} type - タイプ (0: full, 1: inner, 2: outer)
  * @param  {boolean} knockout - ノックアウトモード
- * @param  {number} devicePixelRatio - デバイスピクセル比
- * @param  {IGradientBevelConfig} config - WebGPUリソース設定
+ * @param  {number} device_pixel_ratio - デバイスピクセル比
+ * @param  {IFilterConfig} config - WebGPUリソース設定
  * @return {IAttachmentObject} - フィルター適用後のアタッチメント
  */
-export const execute = (sourceAttachment, matrix, distance, angle, colors, alphas, ratios, blurX, blurY, strength, quality, type, knockout, devicePixelRatio, config) => {
+export const execute = (source_attachment, matrix, distance, angle, colors, alphas, ratios, blur_x, blur_y, strength, quality, type, knockout, device_pixel_ratio, config) => {
     const { device, commandEncoder, frameBufferManager, pipelineManager, textureManager } = config;
     // 元のオフセットを保存
     const baseOffsetX = $offset.x;
     const baseOffsetY = $offset.y;
-    const baseWidth = sourceAttachment.width;
-    const baseHeight = sourceAttachment.height;
+    const baseWidth = source_attachment.width;
+    const baseHeight = source_attachment.height;
     // 変換行列からスケールを取得
     const xScale = Math.sqrt(matrix[0] * matrix[0] + matrix[1] * matrix[1]);
     const yScale = Math.sqrt(matrix[2] * matrix[2] + matrix[3] * matrix[3]);
     // ベベルのオフセットを計算
     const radian = angle * DEG_TO_RAD;
-    const x = Math.cos(radian) * distance * (xScale / devicePixelRatio);
-    const y = Math.sin(radian) * distance * (yScale / devicePixelRatio);
+    const x = Math.cos(radian) * distance * (xScale / device_pixel_ratio);
+    const y = Math.sin(radian) * distance * (yScale / device_pixel_ratio);
     // ===== Step 1: ベベルベーステクスチャ作成 =====
     // WebGL版と同じ: original * (1 - shifted_original.a)
     // shifted = original を (2x, 2y) ピクセル分シフトしたもの
@@ -75,7 +72,7 @@ export const execute = (sourceAttachment, matrix, distance, angle, colors, alpha
     const bevelBaseLayout = pipelineManager.getBindGroupLayout("bevel_base");
     if (!bevelBasePipeline || !bevelBaseLayout) {
         console.error("[WebGPU GradientBevelFilter] bevel_base pipeline not found");
-        return sourceAttachment;
+        return source_attachment;
     }
     const bevelBaseAttachment = frameBufferManager.createTemporaryAttachment(baseWidth, baseHeight);
     const bevelBaseSampler = textureManager.createSampler("bevel_base_sampler", true);
@@ -95,7 +92,7 @@ export const execute = (sourceAttachment, matrix, distance, angle, colors, alpha
     }
     $entries3[0].resource.buffer = bevelBaseUniformBuffer;
     $entries3[1].resource = bevelBaseSampler;
-    $entries3[2].resource = sourceAttachment.texture.view;
+    $entries3[2].resource = source_attachment.texture.view;
     const bevelBaseBindGroup = device.createBindGroup({
         "layout": bevelBaseLayout,
         "entries": $entries3
@@ -108,7 +105,7 @@ export const execute = (sourceAttachment, matrix, distance, angle, colors, alpha
     bevelBaseEncoder.end();
     // ===== Step 2: ベベルベースにブラー適用 =====
     // WebGL版と同じ: bevelBaseをブラーする（元テクスチャではなく）
-    const blurAttachment = filterApplyBlurFilterUseCase(bevelBaseAttachment, matrix, blurX, blurY, quality, devicePixelRatio, config);
+    const blurAttachment = filterApplyBlurFilterUseCase(bevelBaseAttachment, matrix, blur_x, blur_y, quality, device_pixel_ratio, config);
     // ベベルベースは不要になったので解放
     frameBufferManager.releaseTemporaryAttachment(bevelBaseAttachment);
     const blurWidth = blurAttachment.width;
@@ -164,7 +161,7 @@ export const execute = (sourceAttachment, matrix, distance, angle, colors, alpha
     if (!pipeline || !bindGroupLayout) {
         console.error("[WebGPU GradientBevelFilter] Pipeline not found");
         frameBufferManager.releaseTemporaryAttachment(blurAttachment);
-        return sourceAttachment;
+        return source_attachment;
     }
     const sampler = textureManager.createSampler("gradient_bevel_sampler", true);
     // ユニフォームバッファ: 12 floats = 48 bytes
@@ -193,7 +190,7 @@ export const execute = (sourceAttachment, matrix, distance, angle, colors, alpha
     $entries5[0].resource.buffer = uniformBuffer;
     $entries5[1].resource = sampler;
     $entries5[2].resource = blurAttachment.texture.view;
-    $entries5[3].resource = sourceAttachment.texture.view;
+    $entries5[3].resource = source_attachment.texture.view;
     $entries5[4].resource = lutView;
     const bindGroup = device.createBindGroup({
         "layout": bindGroupLayout,

package/src/Filter/GradientGlowFilter/FilterApplyGradientGlowFilterUseCase.d.ts

@@ -9,21 +9,21 @@ import type { IFilterConfig } from "../../interface/IFilterConfig";
  *              2. グラデーションLUT生成（専用テクスチャ）
  *              3. UV変換方式で最終合成（isInsideでハード境界クリッピング）
  *
- * @param  {IAttachmentObject} sourceAttachment - 入力テクスチャ
+ * @param  {IAttachmentObject} source_attachment - 入力テクスチャ
  * @param  {Float32Array} matrix - 変換行列
  * @param  {number} distance - グローの距離
  * @param  {number} angle - グローの角度（度）
  * @param  {Float32Array} colors - 色配列
  * @param  {Float32Array} alphas - アルファ配列
  * @param  {Float32Array} ratios - 比率配列
- * @param  {number} blurX - X方向ブラー量
- * @param  {number} blurY - Y方向ブラー量
+ * @param  {number} blur_x - X方向ブラー量
+ * @param  {number} blur_y - Y方向ブラー量
  * @param  {number} strength - グロー強度
  * @param  {number} quality - クオリティ
  * @param  {number} type - タイプ (0: full, 1: inner, 2: outer)
  * @param  {boolean} knockout - ノックアウトモード
- * @param  {number} devicePixelRatio - デバイスピクセル比
+ * @param  {number} device_pixel_ratio - デバイスピクセル比
  * @param  {IFilterConfig} config - WebGPUリソース設定
  * @return {IAttachmentObject} - フィルター適用後のアタッチメント
  */
-export declare const execute: (sourceAttachment: IAttachmentObject, matrix: Float32Array, distance: number, angle: number, colors: Float32Array, alphas: Float32Array, ratios: Float32Array, blurX: number, blurY: number, strength: number, quality: number, type: number, knockout: boolean, devicePixelRatio: number, config: IFilterConfig) => IAttachmentObject;
+export declare const execute: (source_attachment: IAttachmentObject, matrix: Float32Array, distance: number, angle: number, colors: Float32Array, alphas: Float32Array, ratios: Float32Array, blur_x: number, blur_y: number, strength: number, quality: number, type: number, knockout: boolean, device_pixel_ratio: number, config: IFilterConfig) => IAttachmentObject;

package/src/Filter/GradientGlowFilter/FilterApplyGradientGlowFilterUseCase.js

@@ -1,10 +1,7 @@
 import { $offset } from "../FilterOffset";
 import { execute as filterApplyBlurFilterUseCase } from "../BlurFilter/FilterApplyBlurFilterUseCase";
 import { generateFilterGradientLUT } from "../../Gradient/GradientLUTGenerator";
-/**
- * @description 度からラジアンへの変換係数
- */
-const DEG_TO_RAD = Math.PI / 180;
+import { DEG_TO_RAD } from "../FilterUtil";
 /**
  * @description プリアロケートされたFloat32Array (サイズ12)
  */
@@ -28,32 +25,32 @@ const $entries5 = [
  *              2. グラデーションLUT生成（専用テクスチャ）
  *              3. UV変換方式で最終合成（isInsideでハード境界クリッピング）
  *
- * @param  {IAttachmentObject} sourceAttachment - 入力テクスチャ
+ * @param  {IAttachmentObject} source_attachment - 入力テクスチャ
  * @param  {Float32Array} matrix - 変換行列
  * @param  {number} distance - グローの距離
  * @param  {number} angle - グローの角度（度）
  * @param  {Float32Array} colors - 色配列
  * @param  {Float32Array} alphas - アルファ配列
  * @param  {Float32Array} ratios - 比率配列
- * @param  {number} blurX - X方向ブラー量
- * @param  {number} blurY - Y方向ブラー量
+ * @param  {number} blur_x - X方向ブラー量
+ * @param  {number} blur_y - Y方向ブラー量
  * @param  {number} strength - グロー強度
  * @param  {number} quality - クオリティ
  * @param  {number} type - タイプ (0: full, 1: inner, 2: outer)
  * @param  {boolean} knockout - ノックアウトモード
- * @param  {number} devicePixelRatio - デバイスピクセル比
+ * @param  {number} device_pixel_ratio - デバイスピクセル比
  * @param  {IFilterConfig} config - WebGPUリソース設定
  * @return {IAttachmentObject} - フィルター適用後のアタッチメント
  */
-export const execute = (sourceAttachment, matrix, distance, angle, colors, alphas, ratios, blurX, blurY, strength, quality, type, knockout, devicePixelRatio, config) => {
+export const execute = (source_attachment, matrix, distance, angle, colors, alphas, ratios, blur_x, blur_y, strength, quality, type, knockout, device_pixel_ratio, config) => {
     const { device, commandEncoder, frameBufferManager, pipelineManager, textureManager } = config;
     // 元のオフセットを保存
     const baseOffsetX = $offset.x;
     const baseOffsetY = $offset.y;
-    const baseWidth = sourceAttachment.width;
-    const baseHeight = sourceAttachment.height;
+    const baseWidth = source_attachment.width;
+    const baseHeight = source_attachment.height;
     // ブラーフィルターを適用
-    const blurAttachment = filterApplyBlurFilterUseCase(sourceAttachment, matrix, blurX, blurY, quality, devicePixelRatio, config);
+    const blurAttachment = filterApplyBlurFilterUseCase(source_attachment, matrix, blur_x, blur_y, quality, device_pixel_ratio, config);
     const blurWidth = blurAttachment.width;
     const blurHeight = blurAttachment.height;
     const blurOffsetX = $offset.x;
@@ -65,8 +62,8 @@ export const execute = (sourceAttachment, matrix, distance, angle, colors, alpha
     const yScale = Math.sqrt(matrix[2] * matrix[2] + matrix[3] * matrix[3]);
     // グローのオフセットを計算
     const radian = angle * DEG_TO_RAD;
-    const x = Math.cos(radian) * distance * (xScale / devicePixelRatio);
-    const y = Math.sin(radian) * distance * (yScale / devicePixelRatio);
+    const x = Math.cos(radian) * distance * (xScale / device_pixel_ratio);
+    const y = Math.sin(radian) * distance * (yScale / device_pixel_ratio);
     // ===== WebGL版と同じサイズ・位置計算 =====
     const isInner = type === 1;
     const w = isInner ? baseWidth : blurWidth + Math.max(0, Math.abs(x) - offsetDiffX);
@@ -112,7 +109,7 @@ export const execute = (sourceAttachment, matrix, distance, angle, colors, alpha
     if (!pipeline || !bindGroupLayout) {
         console.error("[WebGPU GradientGlowFilter] Pipeline not found");
         frameBufferManager.releaseTemporaryAttachment(blurAttachment);
-        return sourceAttachment;
+        return source_attachment;
     }
     const sampler = textureManager.createSampler("gradient_glow_sampler", true);
     // ユニフォームバッファ: 12 floats = 48 bytes
@@ -141,7 +138,7 @@ export const execute = (sourceAttachment, matrix, distance, angle, colors, alpha
     $entries5[0].resource.buffer = uniformBuffer;
     $entries5[1].resource = sampler;
     $entries5[2].resource = blurAttachment.texture.view;
-    $entries5[3].resource = sourceAttachment.texture.view;
+    $entries5[3].resource = source_attachment.texture.view;
     $entries5[4].resource = lutView;
     const bindGroup = device.createBindGroup({
         "layout": bindGroupLayout,

package/src/FrameBufferManager/service/FrameBufferManagerCreateRenderPassDescriptorService.d.ts

@@ -1,4 +1,16 @@
 /**
  * @description レンダーパス記述子を作成（プリアロケート再利用）
+ *              Create render pass descriptor (pre-allocated reuse)
+ *
+ * @param  {GPUTextureView} view - レンダーターゲットのテクスチャビュー
+ * @param  {number} r - クリアカラーの赤成分
+ * @param  {number} g - クリアカラーの緑成分
+ * @param  {number} b - クリアカラーの青成分
+ * @param  {number} a - クリアカラーのアルファ成分
+ * @param  {GPULoadOp} load_op - ロード操作
+ * @param  {GPUTextureView | null} resolve_target - MSAAリゾルブターゲット
+ * @return {GPURenderPassDescriptor}
+ * @method
+ * @protected
  */
-export declare const execute: (view: GPUTextureView, r?: number, g?: number, b?: number, a?: number, loadOp?: GPULoadOp, resolveTarget?: GPUTextureView | null) => GPURenderPassDescriptor;
+export declare const execute: (view: GPUTextureView, r?: number, g?: number, b?: number, a?: number, load_op?: GPULoadOp, resolve_target?: GPUTextureView | null) => GPURenderPassDescriptor;

package/src/FrameBufferManager/service/FrameBufferManagerCreateRenderPassDescriptorService.js

@@ -1,23 +1,50 @@
+/**
+ * @description クリアカラー値のプリアロケートオブジェクト
+ *              Pre-allocated clear color value object
+ * @type {GPUColorDict}
+ */
 const $clearValue = { "r": 0, "g": 0, "b": 0, "a": 0 };
+/**
+ * @description カラーアタッチメントのプリアロケートオブジェクト
+ *              Pre-allocated color attachment object
+ * @type {GPURenderPassColorAttachment}
+ */
 const $colorAttachment = {
     "view": null,
     "clearValue": $clearValue,
     "loadOp": "clear",
     "storeOp": "store"
 };
+/**
+ * @description レンダーパス記述子のプリアロケートオブジェクト
+ *              Pre-allocated render pass descriptor object
+ * @type {GPURenderPassDescriptor}
+ */
 const $descriptor = {
     "colorAttachments": [$colorAttachment]
 };
 /**
  * @description レンダーパス記述子を作成（プリアロケート再利用）
+ *              Create render pass descriptor (pre-allocated reuse)
+ *
+ * @param  {GPUTextureView} view - レンダーターゲットのテクスチャビュー
+ * @param  {number} r - クリアカラーの赤成分
+ * @param  {number} g - クリアカラーの緑成分
+ * @param  {number} b - クリアカラーの青成分
+ * @param  {number} a - クリアカラーのアルファ成分
+ * @param  {GPULoadOp} load_op - ロード操作
+ * @param  {GPUTextureView | null} resolve_target - MSAAリゾルブターゲット
+ * @return {GPURenderPassDescriptor}
+ * @method
+ * @protected
  */
-export const execute = (view, r = 0, g = 0, b = 0, a = 0, loadOp = "clear", resolveTarget = null) => {
+export const execute = (view, r = 0, g = 0, b = 0, a = 0, load_op = "clear", resolve_target = null) => {
     $colorAttachment.view = view;
     $clearValue.r = r;
     $clearValue.g = g;
     $clearValue.b = b;
     $clearValue.a = a;
-    $colorAttachment.loadOp = loadOp;
-    $colorAttachment.resolveTarget = resolveTarget ?? undefined;
+    $colorAttachment.loadOp = load_op;
+    $colorAttachment.resolveTarget = resolve_target ?? undefined;
     return $descriptor;
 };

package/src/FrameBufferManager/service/FrameBufferManagerCreateStencilRenderPassDescriptorService.d.ts

@@ -1,4 +1,14 @@
 /**
  * @description ステンシル付きレンダーパス記述子を作成（プリアロケート再利用）
+ *              Create render pass descriptor with stencil (pre-allocated reuse)
+ *
+ * @param  {GPUTextureView} color_view - カラーアタッチメントのテクスチャビュー
+ * @param  {GPUTextureView} stencil_view - ステンシルアタッチメントのテクスチャビュー
+ * @param  {GPULoadOp} color_load_op - カラーのロード操作
+ * @param  {GPULoadOp} stencil_load_op - ステンシルのロード操作
+ * @param  {GPUTextureView | null} resolve_target - MSAAリゾルブターゲット
+ * @return {GPURenderPassDescriptor}
+ * @method
+ * @protected
  */
-export declare const execute: (colorView: GPUTextureView, stencilView: GPUTextureView, colorLoadOp?: GPULoadOp, stencilLoadOp?: GPULoadOp, resolveTarget?: GPUTextureView | null) => GPURenderPassDescriptor;
+export declare const execute: (color_view: GPUTextureView, stencil_view: GPUTextureView, color_load_op?: GPULoadOp, stencil_load_op?: GPULoadOp, resolve_target?: GPUTextureView | null) => GPURenderPassDescriptor;

package/src/FrameBufferManager/service/FrameBufferManagerCreateStencilRenderPassDescriptorService.js

@@ -1,28 +1,58 @@
+/**
+ * @description クリアカラー値のプリアロケートオブジェクト
+ *              Pre-allocated clear color value object
+ * @type {GPUColorDict}
+ */
 const $clearValue = { "r": 0, "g": 0, "b": 0, "a": 0 };
+/**
+ * @description カラーアタッチメントのプリアロケートオブジェクト
+ *              Pre-allocated color attachment object
+ * @type {GPURenderPassColorAttachment}
+ */
 const $colorAttachment = {
     "view": null,
     "clearValue": $clearValue,
     "loadOp": "load",
     "storeOp": "store"
 };
+/**
+ * @description 深度ステンシルアタッチメントのプリアロケートオブジェクト
+ *              Pre-allocated depth stencil attachment object
+ * @type {GPURenderPassDepthStencilAttachment}
+ */
 const $depthStencilAttachment = {
     "view": null,
     "stencilClearValue": 0,
     "stencilLoadOp": "clear",
     "stencilStoreOp": "store"
 };
+/**
+ * @description ステンシル付きレンダーパス記述子のプリアロケートオブジェクト
+ *              Pre-allocated render pass descriptor with stencil
+ * @type {GPURenderPassDescriptor}
+ */
 const $descriptor = {
     "colorAttachments": [$colorAttachment],
     "depthStencilAttachment": $depthStencilAttachment
 };
 /**
  * @description ステンシル付きレンダーパス記述子を作成（プリアロケート再利用）
+ *              Create render pass descriptor with stencil (pre-allocated reuse)
+ *
+ * @param  {GPUTextureView} color_view - カラーアタッチメントのテクスチャビュー
+ * @param  {GPUTextureView} stencil_view - ステンシルアタッチメントのテクスチャビュー
+ * @param  {GPULoadOp} color_load_op - カラーのロード操作
+ * @param  {GPULoadOp} stencil_load_op - ステンシルのロード操作
+ * @param  {GPUTextureView | null} resolve_target - MSAAリゾルブターゲット
+ * @return {GPURenderPassDescriptor}
+ * @method
+ * @protected
  */
-export const execute = (colorView, stencilView, colorLoadOp = "load", stencilLoadOp = "clear", resolveTarget = null) => {
-    $colorAttachment.view = colorView;
-    $colorAttachment.loadOp = colorLoadOp;
-    $colorAttachment.resolveTarget = resolveTarget ?? undefined;
-    $depthStencilAttachment.view = stencilView;
-    $depthStencilAttachment.stencilLoadOp = stencilLoadOp;
+export const execute = (color_view, stencil_view, color_load_op = "load", stencil_load_op = "clear", resolve_target = null) => {
+    $colorAttachment.view = color_view;
+    $colorAttachment.loadOp = color_load_op;
+    $colorAttachment.resolveTarget = resolve_target ?? undefined;
+    $depthStencilAttachment.view = stencil_view;
+    $depthStencilAttachment.stencilLoadOp = stencil_load_op;
     return $descriptor;
 };

package/src/FrameBufferManager/usecase/FrameBufferManagerCreateAttachmentUseCase.d.ts

@@ -3,20 +3,20 @@ import type { IAttachmentObject } from "../../interface/IAttachmentObject";
  * @description アタッチメントオブジェクトを作成
  *              Create attachment object
  *
- * @param  {GPUDevice} device
- * @param  {GPUTextureFormat} format
- * @param  {Map<string, IAttachmentObject>} attachments
- * @param  {string} name
- * @param  {number} width
- * @param  {number} height
- * @param  {boolean} msaa
- * @param  {boolean} mask
- * @param  {{ nextId: number, textureId: number, stencilId: number }} idCounter
+ * @param  {GPUDevice} device - GPUデバイス
+ * @param  {GPUTextureFormat} format - テクスチャフォーマット
+ * @param  {Map<string, IAttachmentObject>} attachments - アタッチメント管理マップ
+ * @param  {string} name - アタッチメント名
+ * @param  {number} width - テクスチャ幅
+ * @param  {number} height - テクスチャ高さ
+ * @param  {boolean} msaa - MSAA有効フラグ
+ * @param  {boolean} mask - マスク有効フラグ
+ * @param  {{ nextId: number, textureId: number, stencilId: number }} id_counter - ID管理カウンタ
  * @return {IAttachmentObject}
  * @method
  * @protected
  */
-export declare const execute: (device: GPUDevice, format: GPUTextureFormat, attachments: Map<string, IAttachmentObject>, name: string, width: number, height: number, msaa: boolean, mask: boolean, idCounter: {
+export declare const execute: (device: GPUDevice, format: GPUTextureFormat, attachments: Map<string, IAttachmentObject>, name: string, width: number, height: number, msaa: boolean, mask: boolean, id_counter: {
     nextId: number;
     textureId: number;
     stencilId: number;

package/src/FrameBufferManager/usecase/FrameBufferManagerCreateAttachmentUseCase.js

@@ -3,20 +3,20 @@ import { $samples } from "../../WebGPUUtil";
  * @description アタッチメントオブジェクトを作成
  *              Create attachment object
  *
- * @param  {GPUDevice} device
- * @param  {GPUTextureFormat} format
- * @param  {Map<string, IAttachmentObject>} attachments
- * @param  {string} name
- * @param  {number} width
- * @param  {number} height
- * @param  {boolean} msaa
- * @param  {boolean} mask
- * @param  {{ nextId: number, textureId: number, stencilId: number }} idCounter
+ * @param  {GPUDevice} device - GPUデバイス
+ * @param  {GPUTextureFormat} format - テクスチャフォーマット
+ * @param  {Map<string, IAttachmentObject>} attachments - アタッチメント管理マップ
+ * @param  {string} name - アタッチメント名
+ * @param  {number} width - テクスチャ幅
+ * @param  {number} height - テクスチャ高さ
+ * @param  {boolean} msaa - MSAA有効フラグ
+ * @param  {boolean} mask - マスク有効フラグ
+ * @param  {{ nextId: number, textureId: number, stencilId: number }} id_counter - ID管理カウンタ
  * @return {IAttachmentObject}
  * @method
  * @protected
  */
-export const execute = (device, format, attachments, name, width, height, msaa, mask, idCounter) => {
+export const execute = (device, format, attachments, name, width, height, msaa, mask, id_counter) => {
     // アトラスかどうか判定（atlas, atlas_0, atlas_1, ...）
     const isAtlas = name === "atlas" || name.startsWith("atlas_");
     // アトラステクスチャと一時アタッチメントはRGBA8フォーマットを使用
@@ -38,7 +38,7 @@ export const execute = (device, format, attachments, name, width, height, msaa,
     const textureView = gpuTexture.createView();
     // ITextureObject形式で格納（解決先テクスチャ）
     const texture = {
-        "id": idCounter.textureId++,
+        "id": id_counter.textureId++,
         "resource": gpuTexture,
         "view": textureView,
         width,
@@ -57,7 +57,7 @@ export const execute = (device, format, attachments, name, width, height, msaa,
         });
         const msaaTextureView = msaaGpuTexture.createView();
         msaaTexture = {
-            "id": idCounter.textureId++,
+            "id": id_counter.textureId++,
             "resource": msaaGpuTexture,
             "view": msaaTextureView,
             width,
@@ -79,7 +79,7 @@ export const execute = (device, format, attachments, name, width, height, msaa,
         });
         const stencilView = stencilTexture.createView();
         stencil = {
-            "id": idCounter.stencilId++,
+            "id": id_counter.stencilId++,
             "resource": stencilTexture,
             "view": stencilView,
             width,
@@ -97,7 +97,7 @@ export const execute = (device, format, attachments, name, width, height, msaa,
             });
             const msaaStencilView = msaaStencilTexture.createView();
             msaaStencil = {
-                "id": idCounter.stencilId++,
+                "id": id_counter.stencilId++,
                 "resource": msaaStencilTexture,
                 "view": msaaStencilView,
                 width,
@@ -108,7 +108,7 @@ export const execute = (device, format, attachments, name, width, height, msaa,
         }
     }
     const attachment = {
-        "id": idCounter.nextId++,
+        "id": id_counter.nextId++,
         width,
         height,
         "clipLevel": 0,

package/src/FrameBufferManager/usecase/FrameBufferManagerReleaseTemporaryAttachmentUseCase.d.ts

@@ -4,11 +4,11 @@ import type { IAttachmentObject } from "../../interface/IAttachmentObject";
  *              Releases a temporary attachment after filter processing
  *              テクスチャは即座に破棄せず、フレーム終了時に遅延解放します
  *
- * @param  {Map<string, IAttachmentObject>} attachments
- * @param  {IAttachmentObject[]} pendingReleases
- * @param  {IAttachmentObject} attachment
+ * @param  {Map<string, IAttachmentObject>} attachments - アタッチメント管理マップ
+ * @param  {IAttachmentObject[]} pending_releases - 遅延解放キュー
+ * @param  {IAttachmentObject} attachment - 解放するアタッチメント
  * @return {void}
  * @method
  * @protected
  */
-export declare const execute: (attachments: Map<string, IAttachmentObject>, pendingReleases: IAttachmentObject[], attachment: IAttachmentObject) => void;
+export declare const execute: (attachments: Map<string, IAttachmentObject>, pending_releases: IAttachmentObject[], attachment: IAttachmentObject) => void;