@next2d/webgl 2.0.0 → 3.0.1

package/src/Shader/ShaderInstancedManager.d.ts

@@ -1,32 +1,6 @@
 import { ShaderManager } from "./ShaderManager";
-/**
- * @class
- * @extends ShaderManager
- */
 export declare class ShaderInstancedManager extends ShaderManager {
-    /**
-     * @description attribute変数の数
-     *              Number of attribute variables
-     *
-     * @type {number}
-     * @public
-     */
     count: number;
-    /**
-     * @param {string} vertex_source
-     * @param {string} fragment_source
-     * @param {boolean} [atlas=true]
-     * @constructor
-     * @public
-     */
     constructor(vertex_source: string, fragment_source: string, atlas?: boolean);
-    /**
-     * @description attributeの配列を初期化します。
-     *              Initialize the array of attributes.
-     *
-     * @return {void}
-     * @method
-     * @public
-     */
     clear(): void;
 }

package/src/Shader/ShaderInstancedManager.js

@@ -1,26 +1,8 @@
 import { ShaderManager } from "./ShaderManager";
 import { renderQueue } from "@next2d/render-queue";
-/**
- * @class
- * @extends ShaderManager
- */
 export class ShaderInstancedManager extends ShaderManager {
-    /**
-     * @param {string} vertex_source
-     * @param {string} fragment_source
-     * @param {boolean} [atlas=true]
-     * @constructor
-     * @public
-     */
     constructor(vertex_source, fragment_source, atlas = true) {
         super(vertex_source, fragment_source, atlas);
-        /**
-         * @description attribute変数の数
-         *              Number of attribute variables
-         *
-         * @type {number}
-         * @public
-         */
         Object.defineProperty(this, "count", {
             enumerable: true,
             configurable: true,
@@ -29,14 +11,6 @@ export class ShaderInstancedManager extends ShaderManager {
         });
         this.count = 0;
     }
-    /**
-     * @description attributeの配列を初期化します。
-     *              Initialize the array of attributes.
-     *
-     * @return {void}
-     * @method
-     * @public
-     */
     clear() {
         this.count = renderQueue.offset = 0;
     }

package/src/Shader/ShaderManager/service/ShaderManagerSetBitmapFillUniformService.js

@@ -1,4 +1,4 @@
-import { $context, $inverseMatrix, $getViewportWidth, $getViewportHeight } from "../../../WebGLUtil";
+import { $context, $inverseMatrix, $viewportWidth, $viewportHeight } from "../../../WebGLUtil";
 /**
  * @description ShaderManagerのBitmapの塗りのuniform変数を設定します。
  *              Set the fill uniform variables of the ShaderManager.
@@ -36,8 +36,8 @@ export const execute = (shader_manager, width, height, grid_data) => {
     highp[15] = inverseMatrix[7];
     highp[19] = inverseMatrix[8];
     // vertex: u_viewport
-    highp[3] = $getViewportWidth();
-    highp[7] = $getViewportHeight();
+    highp[3] = $viewportWidth;
+    highp[7] = $viewportHeight;
     if (grid_data) {
         // vertex: u_parent_matrix
         highp[20] = grid_data[0];

package/src/Shader/ShaderManager/service/ShaderManagerSetFillUniformService.js

@@ -1,4 +1,4 @@
-import { $getViewportWidth, $getViewportHeight } from "../../../WebGLUtil";
+import { $viewportWidth, $viewportHeight } from "../../../WebGLUtil";
 /**
  * @description ShaderManagerの塗りのuniform変数を設定します。
  *              Set the fill uniform variables of the ShaderManager.
@@ -32,8 +32,8 @@ export const execute = (shader_manager, grid_data) => {
     highp[21] = grid_data[11];
     highp[22] = 1;
     // vertex: u_viewport
-    highp[3] = $getViewportWidth();
-    highp[7] = $getViewportHeight();
+    highp[3] = $viewportWidth;
+    highp[7] = $viewportHeight;
     // vertex: u_parent_viewport
     highp[11] = grid_data[12];
     highp[15] = grid_data[13];

package/src/Shader/ShaderManager/service/ShaderManagerSetGradientFillUniformService.js

@@ -1,4 +1,4 @@
-import { $getViewportWidth, $getViewportHeight, $clamp } from "../../../WebGLUtil";
+import { $viewportWidth, $viewportHeight, $clamp } from "../../../WebGLUtil";
 /**
  * @description 塗りのグラデーションのuniformを設定
  *              Set fill gradient uniform
@@ -37,8 +37,8 @@ export const execute = (shader_manager, type, matrix, inverse_matrix, focal_poin
     highp[15] = inverse_matrix[7];
     highp[19] = inverse_matrix[8];
     // vertex: u_viewport
-    highp[3] = $getViewportWidth();
-    highp[7] = $getViewportHeight();
+    highp[3] = $viewportWidth;
+    highp[7] = $viewportHeight;
     let index = 20;
     if (grid_data) {
         // vertex: u_parent_matrix

package/src/Shader/ShaderManager/service/ShaderManagerSetMaskUniformService.js

@@ -1,4 +1,4 @@
-import { $getViewportWidth, $getViewportHeight } from "../../../WebGLUtil";
+import { $viewportWidth, $viewportHeight } from "../../../WebGLUtil";
 /**
  * @description ShaderManagerのマスクのuniform変数を設定します。
  *              Set the mask uniform variables of the ShaderManager.
@@ -31,8 +31,8 @@ export const execute = (shader_manager, grid_data) => {
     highp[21] = grid_data[11];
     highp[22] = 1;
     // vertex: u_viewport
-    highp[3] = $getViewportWidth();
-    highp[7] = $getViewportHeight();
+    highp[3] = $viewportWidth;
+    highp[7] = $viewportHeight;
     // vertex: u_parent_viewport
     highp[11] = grid_data[12];
     highp[15] = grid_data[13];

package/src/Shader/ShaderManager/service/ShaderManagerSetMatrixTextureUniformService.js

@@ -1,4 +1,4 @@
-import { $context, $getViewportHeight, $getViewportWidth } from "../../../WebGLUtil";
+import { $context, $viewportHeight, $viewportWidth } from "../../../WebGLUtil";
 /**
  * @description ShaderManagerのTextureのuniform変数を設定します。
  *              Set the Texture uniform variables of the ShaderManager.
@@ -24,6 +24,6 @@ export const execute = (shader_manager, width, height) => {
     highp[6] = width;
     highp[7] = height;
     // vertex: u_viewport
-    highp[8] = $getViewportWidth();
-    highp[9] = $getViewportHeight();
+    highp[8] = $viewportWidth;
+    highp[9] = $viewportHeight;
 };

package/src/Shader/ShaderManager/service/ShaderManagerSetMatrixTextureWithColorTransformUniformService.js

@@ -1,4 +1,4 @@
-import { $context, $getViewportHeight, $getViewportWidth } from "../../../WebGLUtil";
+import { $context, $viewportHeight, $viewportWidth } from "../../../WebGLUtil";
 /**
  * @description ShaderManagerのTextureのuniform変数を設定します。
  *              Set the Texture uniform variables of the ShaderManager.
@@ -24,8 +24,8 @@ export const execute = (shader_manager, color_transform, width, height) => {
     highp[6] = width;
     highp[7] = height;
     // vertex: u_viewport
-    highp[8] = $getViewportWidth();
-    highp[9] = $getViewportHeight();
+    highp[8] = $viewportWidth;
+    highp[9] = $viewportHeight;
     const mediump = shader_manager.mediump;
     mediump[0] = color_transform[0];
     mediump[1] = color_transform[1];

package/src/Shader/ShaderManager/service/ShaderManagerSetTextureUniformService.js

@@ -1,4 +1,4 @@
-import { $context, $getViewportHeight, $getViewportWidth } from "../../../WebGLUtil";
+import { $context, $viewportHeight, $viewportWidth } from "../../../WebGLUtil";
 /**
  * @description ShaderManagerのTextureのuniform変数を設定します。
  *              Set the Texture uniform variables of the ShaderManager.
@@ -20,6 +20,6 @@ export const execute = (shader_manager, width, height) => {
     highp[2] = width;
     highp[3] = height;
     // vertex: u_viewport
-    highp[4] = $getViewportWidth();
-    highp[5] = $getViewportHeight();
+    highp[4] = $viewportWidth;
+    highp[5] = $viewportHeight;
 };

package/src/Shader/ShaderManager.d.ts

@@ -1,78 +1,10 @@
-/**
- * @description 利用用途に合わせたシェーダークラス
- *              Shader class tailored to the intended use
- *
- * @class
- * @public
- */
 export declare class ShaderManager {
-    /**
-     * @description WebGLプログラムオブジェクト
-     *              WebGL program object
-     *
-     * @type {IProgramObject}
-     * @public
-     */
     private readonly _$programObject;
-    /**
-     * @description uniform変数のマップ
-     *              Map of uniform variables
-     *
-     * @type {Map<string, IUniformData>}
-     * @private
-     */
     private readonly _$uniformMap;
-    /**
-     * @param {string} vertex_source
-     * @param {string} fragment_source
-     * @param {boolean} [atlas=false]
-     * @constructor
-     * @public
-     */
+    readonly highp: Int32Array | Float32Array;
+    readonly mediump: Int32Array | Float32Array;
+    readonly textures: Int32Array | Float32Array;
     constructor(vertex_source: string, fragment_source: string, atlas?: boolean);
-    /**
-     * @description 生成したプログラムを利用します。
-     *              Use the generated program.
-     *
-     * @return {void}
-     * @method
-     * @public
-     */
     useProgram(): void;
-    /**
-     * @description uniform変数をバインドします。
-     *              Bind uniform variables.
-     *
-     * @return {void}
-     * @method
-     * @public
-     */
     bindUniform(): void;
-    /**
-     * @description highp uniform変数
-     *              highp uniform variable
-     *
-     * @type {Int32Array | Float32Array}
-     * @readonly
-     * @public
-     */
-    get highp(): Int32Array | Float32Array;
-    /**
-     * @description mediump uniform変数
-     *              mediump uniform variable
-     *
-     * @type {Int32Array | Float32Array}
-     * @readonly
-     * @public
-     */
-    get mediump(): Int32Array | Float32Array;
-    /**
-     * @description texture uniform変数
-     *              texture uniform variable
-     *
-     * @type {Int32Array | Float32Array}
-     * @readonly
-     * @public
-     */
-    get textures(): Int32Array | Float32Array;
 }

package/src/Shader/ShaderManager.js

@@ -2,108 +2,50 @@ import { execute as shaderManagerCreateProgramService } from "./ShaderManager/se
 import { execute as shaderManagerInitializeUniformService } from "./ShaderManager/service/ShaderManagerInitializeUniformService";
 import { execute as shaderManagerUseProgramService } from "./ShaderManager/service/ShaderManagerUseProgramService";
 import { execute as shaderManagerBindUniformService } from "./ShaderManager/service/ShaderManagerBindUniformService";
-/**
- * @description 利用用途に合わせたシェーダークラス
- *              Shader class tailored to the intended use
- *
- * @class
- * @public
- */
 export class ShaderManager {
-    /**
-     * @param {string} vertex_source
-     * @param {string} fragment_source
-     * @param {boolean} [atlas=false]
-     * @constructor
-     * @public
-     */
     constructor(vertex_source, fragment_source, atlas = false) {
-        /**
-         * @description WebGLプログラムオブジェクト
-         *              WebGL program object
-         *
-         * @type {IProgramObject}
-         * @public
-         */
         Object.defineProperty(this, "_$programObject", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: void 0
         });
-        /**
-         * @description uniform変数のマップ
-         *              Map of uniform variables
-         *
-         * @type {Map<string, IUniformData>}
-         * @private
-         */
         Object.defineProperty(this, "_$uniformMap", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: void 0
         });
+        Object.defineProperty(this, "highp", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "mediump", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "textures", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
         this._$programObject = shaderManagerCreateProgramService(vertex_source, fragment_source);
         this._$uniformMap = new Map();
         shaderManagerInitializeUniformService(this._$programObject.resource, this._$uniformMap, atlas);
+        const emptyArray = new Float32Array(0);
+        this.highp = this._$uniformMap.get("u_highp")?.array ?? emptyArray;
+        this.mediump = this._$uniformMap.get("u_mediump")?.array ?? emptyArray;
+        this.textures = this._$uniformMap.get("u_textures")?.array ?? emptyArray;
     }
-    /**
-     * @description 生成したプログラムを利用します。
-     *              Use the generated program.
-     *
-     * @return {void}
-     * @method
-     * @public
-     */
     useProgram() {
         shaderManagerUseProgramService(this._$programObject);
     }
-    /**
-     * @description uniform変数をバインドします。
-     *              Bind uniform variables.
-     *
-     * @return {void}
-     * @method
-     * @public
-     */
     bindUniform() {
         shaderManagerBindUniformService(this._$uniformMap);
     }
-    /**
-     * @description highp uniform変数
-     *              highp uniform variable
-     *
-     * @type {Int32Array | Float32Array}
-     * @readonly
-     * @public
-     */
-    get highp() {
-        const data = this._$uniformMap.get("u_highp");
-        return data.array;
-    }
-    /**
-     * @description mediump uniform変数
-     *              mediump uniform variable
-     *
-     * @type {Int32Array | Float32Array}
-     * @readonly
-     * @public
-     */
-    get mediump() {
-        const data = this._$uniformMap.get("u_mediump");
-        return data.array;
-    }
-    /**
-     * @description texture uniform変数
-     *              texture uniform variable
-     *
-     * @type {Int32Array | Float32Array}
-     * @readonly
-     * @public
-     */
-    get textures() {
-        const data = this._$uniformMap.get("u_textures");
-        return data.array;
-    }
 }

package/src/Shader/Variants/Filter/service/VariantsBitmapFilterShaderService.js

@@ -24,7 +24,8 @@ export const execute = (transforms_base, transforms_blur, is_glow, type, knockou
     const key3 = is_glow ? "y" : "n";
     const key4 = knockout ? "y" : "n";
     const key5 = applies_strength ? "y" : "n";
-    const key = `f${key1}${key2}${key3}${type}${key4}${key5}`;
+    const key6 = is_gradient ? "y" : "n";
+    const key = `f${key1}${key2}${key3}${type}${key4}${key5}${key6}`;
     if ($collection.has(key)) {
         return $collection.get(key);
     }

package/src/Shader/Variants/GradientLUT/service/VariantsGradientLUTShaderService.d.ts

@@ -1,7 +1,7 @@
 import { ShaderManager } from "../../../ShaderManager";
 /**
- * @description グラデーションLUTのシェーダーを返却
- *              Returns the shader of the gradient LUT
+ * @description グラデーションLUTのシェーダーを返却（LRUキャッシュ使用）
+ *              Returns the shader of the gradient LUT (using LRU cache)
  *
  * @param  {number} stops_length
  * @param  {boolean} is_linear_space

package/src/Shader/Variants/GradientLUT/service/VariantsGradientLUTShaderService.js

@@ -1,10 +1,10 @@
-import { $collection } from "../../GradientLUTVariants";
+import { $getFromCache, $addToCache } from "../../GradientLUTVariants";
 import { ShaderManager } from "../../../ShaderManager";
 import { TEXTURE_TEMPLATE } from "../../../Vertex/VertexShaderSource";
 import { GRADIENT_LUT_TEMPLATE } from "../../../Fragment/FragmentShaderSourceGradientLUT";
 /**
- * @description グラデーションLUTのシェーダーを返却
- *              Returns the shader of the gradient LUT
+ * @description グラデーションLUTのシェーダーを返却（LRUキャッシュ使用）
+ *              Returns the shader of the gradient LUT (using LRU cache)
  *
  * @param  {number} stops_length
  * @param  {boolean} is_linear_space
@@ -16,11 +16,14 @@ export const execute = (stops_length, is_linear_space) => {
     const key1 = ("00" + stops_length).slice(-3);
     const key2 = is_linear_space ? "y" : "n";
     const key = `l${key1}${key2}`;
-    if ($collection.has(key)) {
-        return $collection.get(key);
+    // LRUキャッシュから取得を試みる
+    const cachedShader = $getFromCache(key);
+    if (cachedShader) {
+        return cachedShader;
     }
     const mediumpLength = Math.ceil(stops_length * 5 / 4);
     const shader = new ShaderManager(TEXTURE_TEMPLATE(), GRADIENT_LUT_TEMPLATE(mediumpLength, stops_length, is_linear_space));
-    $collection.set(key, shader);
+    // LRUキャッシュに追加
+    $addToCache(key, shader);
     return shader;
 };

package/src/Shader/Variants/GradientLUTVariants.d.ts

@@ -7,3 +7,24 @@ import type { ShaderManager } from "../ShaderManager";
  * @public
  */
 export declare const $collection: Map<string, ShaderManager>;
+/**
+ * @description シェーダーをキャッシュに追加（LRU方式）
+ *              Add shader to cache (LRU method)
+ *
+ * @param  {string} key
+ * @param  {ShaderManager} shader
+ * @return {void}
+ * @method
+ * @protected
+ */
+export declare const $addToCache: (key: string, shader: ShaderManager) => void;
+/**
+ * @description キャッシュからシェーダーを取得（使用順序を更新）
+ *              Get shader from cache (update usage order)
+ *
+ * @param  {string} key
+ * @return {ShaderManager | undefined}
+ * @method
+ * @protected
+ */
+export declare const $getFromCache: (key: string) => ShaderManager | undefined;

package/src/Shader/Variants/GradientLUTVariants.js

@@ -1,3 +1,11 @@
+/**
+ * @description シェーダーキャッシュの最大サイズ
+ *              Maximum shader cache size
+ *
+ * @type {number}
+ * @const
+ */
+const MAX_SHADER_CACHE_SIZE = 16;
 /**
  * @description グラデーションLUTのシェーダー管理クラスのコレクション
  *              Collection of gradient LUT shader management classes
@@ -6,3 +14,58 @@
  * @public
  */
 export const $collection = new Map();
+/**
+ * @description 使用順序を追跡するためのキュー
+ *              Queue for tracking usage order (LRU)
+ *
+ * @type {string[]}
+ * @private
+ */
+const $usageOrder = [];
+/**
+ * @description シェーダーをキャッシュに追加（LRU方式）
+ *              Add shader to cache (LRU method)
+ *
+ * @param  {string} key
+ * @param  {ShaderManager} shader
+ * @return {void}
+ * @method
+ * @protected
+ */
+export const $addToCache = (key, shader) => {
+    // すでに存在する場合は使用順序を更新
+    const existingIndex = $usageOrder.indexOf(key);
+    if (existingIndex !== -1) {
+        $usageOrder.splice(existingIndex, 1);
+    }
+    // キャッシュサイズ制限を超える場合、最も古いエントリを削除
+    while ($collection.size >= MAX_SHADER_CACHE_SIZE && $usageOrder.length > 0) {
+        const oldestKey = $usageOrder.shift();
+        if (oldestKey) {
+            $collection.delete(oldestKey);
+        }
+    }
+    $collection.set(key, shader);
+    $usageOrder.push(key);
+};
+/**
+ * @description キャッシュからシェーダーを取得（使用順序を更新）
+ *              Get shader from cache (update usage order)
+ *
+ * @param  {string} key
+ * @return {ShaderManager | undefined}
+ * @method
+ * @protected
+ */
+export const $getFromCache = (key) => {
+    const shader = $collection.get(key);
+    if (shader) {
+        // 使用順序を更新
+        const index = $usageOrder.indexOf(key);
+        if (index !== -1) {
+            $usageOrder.splice(index, 1);
+            $usageOrder.push(key);
+        }
+    }
+    return shader;
+};

package/src/Shader/Vertex/VertexShaderLibrary.d.ts

@@ -1,19 +1,2 @@
-/**
- * @description グリッドがオフの場合の頂点シェーダー
- *              Vertex shader when grid is off
- *
- * @return {string}
- * @method
- * @static
- */
 export declare const FUNCTION_GRID_OFF: () => string;
-/**
- * @description グリッドがオンの場合の頂点シェーダー
- *              Vertex shader when grid is on
- *
- * @param  {number} index
- * @return {STRing}
- * @method
- * @static
- */
 export declare const FUNCTION_GRID_ON: (index: number) => string;

package/src/Shader/Vertex/VertexShaderLibrary.js

@@ -1,11 +1,3 @@
-/**
- * @description グリッドがオフの場合の頂点シェーダー
- *              Vertex shader when grid is off
- *
- * @return {string}
- * @method
- * @static
- */
 export const FUNCTION_GRID_OFF = () => {
     return `
 vec2 applyMatrix(in vec2 vertex) {
@@ -13,15 +5,6 @@ vec2 applyMatrix(in vec2 vertex) {
     return (matrix * vec3(vertex, 1.0)).xy;
 }`;
 };
-/**
- * @description グリッドがオンの場合の頂点シェーダー
- *              Vertex shader when grid is on
- *
- * @param  {number} index
- * @return {STRing}
- * @method
- * @static
- */
 export const FUNCTION_GRID_ON = (index) => {
     return `
 vec2 applyMatrix(in vec2 vertex) {
@@ -40,7 +23,7 @@ vec2 applyMatrix(in vec2 vertex) {
     vec2 parent_size   = vec2(u_highp[${index + 4}].w, u_highp[${index + 5}].w);
     vec4 grid_min = u_highp[${index + 6}];
     vec4 grid_max = u_highp[${index + 7}];
-    
+
     vec2 position = (parent_matrix * vec3(vertex, 1.0)).xy;
     position = (position - parent_offset) / parent_size;
 

package/src/Shader/Vertex/VertexShaderSource.d.ts

@@ -1,30 +1,5 @@
-/**
- * @return {string}
- * @method
- * @static
- */
 export declare const TEXTURE_TEMPLATE: () => string;
-/**
- * @return {string}
- * @method
- * @static
- */
 export declare const VECTOR_TEMPLATE: () => string;
-/**
- * @return {string}
- * @method
- * @static
- */
 export declare const BLEND_MATRIX_TEMPLATE: () => string;
-/**
- * @return {string}
- * @method
- * @static
- */
 export declare const BLEND_TEMPLATE: () => string;
-/**
- * @return {string}
- * @method
- * @static
- */
 export declare const INSTANCE_TEMPLATE: () => string;