kiwiengine 0.6.2 → 0.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/dom/dom-particle.js +74 -23
- package/lib/dom/dom-particle.js.map +1 -1
- package/lib/node/core/game-object.js +4 -1
- package/lib/node/core/game-object.js.map +1 -1
- package/lib/node/core/renderable.js +4 -6
- package/lib/node/core/renderable.js.map +1 -1
- package/lib/node/core/transformable.js +42 -11
- package/lib/node/core/transformable.js.map +1 -1
- package/lib/node/ext/animated-sprite.js +8 -1
- package/lib/node/ext/animated-sprite.js.map +1 -1
- package/lib/node/ext/bitmap-text.js +61 -4
- package/lib/node/ext/bitmap-text.js.map +1 -1
- package/lib/node/ext/circle.js +2 -1
- package/lib/node/ext/circle.js.map +1 -1
- package/lib/node/ext/particle.js +65 -15
- package/lib/node/ext/particle.js.map +1 -1
- package/lib/node/ext/rectangle.js +2 -1
- package/lib/node/ext/rectangle.js.map +1 -1
- package/lib/renderer/camera.js +8 -0
- package/lib/renderer/camera.js.map +1 -1
- package/lib/renderer/renderer.js +7 -2
- package/lib/renderer/renderer.js.map +1 -1
- package/lib/types/dom/dom-particle.d.ts +1 -0
- package/lib/types/dom/dom-particle.d.ts.map +1 -1
- package/lib/types/node/core/game-object.d.ts +3 -1
- package/lib/types/node/core/game-object.d.ts.map +1 -1
- package/lib/types/node/core/renderable.d.ts +0 -1
- package/lib/types/node/core/renderable.d.ts.map +1 -1
- package/lib/types/node/core/transformable.d.ts.map +1 -1
- package/lib/types/node/ext/animated-sprite.d.ts.map +1 -1
- package/lib/types/node/ext/bitmap-text.d.ts.map +1 -1
- package/lib/types/node/ext/circle.d.ts.map +1 -1
- package/lib/types/node/ext/particle.d.ts +1 -0
- package/lib/types/node/ext/particle.d.ts.map +1 -1
- package/lib/types/node/ext/rectangle.d.ts.map +1 -1
- package/lib/types/renderer/camera.d.ts.map +1 -1
- package/lib/types/renderer/renderer.d.ts.map +1 -1
- package/package.json +4 -4
- package/src/dom/dom-particle.ts +91 -24
- package/src/node/core/game-object.ts +10 -2
- package/src/node/core/renderable.ts +4 -5
- package/src/node/core/transformable.ts +49 -11
- package/src/node/ext/animated-sprite.ts +10 -1
- package/src/node/ext/bitmap-text.ts +70 -4
- package/src/node/ext/circle.ts +2 -1
- package/src/node/ext/particle.ts +80 -16
- package/src/node/ext/rectangle.ts +2 -1
- package/src/renderer/camera.ts +6 -0
- package/src/renderer/renderer.ts +9 -2
package/lib/dom/dom-particle.js
CHANGED
|
@@ -18,6 +18,9 @@ export class DomParticleSystem extends DomGameObject {
|
|
|
18
18
|
#texture;
|
|
19
19
|
#loadTexturePromise;
|
|
20
20
|
#particles = [];
|
|
21
|
+
// [성능 최적화] DOM 엘리먼트 풀 - 재사용으로 DOM 조작 및 GC 부담 감소
|
|
22
|
+
#elementPool = [];
|
|
23
|
+
#poolSize;
|
|
21
24
|
constructor(options) {
|
|
22
25
|
super(options);
|
|
23
26
|
this.el.style.pointerEvents = 'none';
|
|
@@ -31,6 +34,7 @@ export class DomParticleSystem extends DomGameObject {
|
|
|
31
34
|
this.#fadeRate = options.fadeRate;
|
|
32
35
|
this.#orientToVelocity = options.orientToVelocity;
|
|
33
36
|
this.#blendMode = options.blendMode;
|
|
37
|
+
this.#poolSize = options.poolSize ?? 100;
|
|
34
38
|
this.#loadTexturePromise = this.#loadTexture();
|
|
35
39
|
}
|
|
36
40
|
async #loadTexture() {
|
|
@@ -42,18 +46,22 @@ export class DomParticleSystem extends DomGameObject {
|
|
|
42
46
|
this.#texture = await domTextureLoader.load(this.#textureSrc);
|
|
43
47
|
}
|
|
44
48
|
}
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
49
|
+
// [성능 최적화] 풀에서 엘리먼트 가져오거나 새로 생성
|
|
50
|
+
#acquireElement(x, y, scale, angle) {
|
|
51
|
+
let el = this.#elementPool.pop();
|
|
52
|
+
if (el) {
|
|
53
|
+
// 풀에서 가져온 엘리먼트 재설정
|
|
54
|
+
setStyle(el, {
|
|
55
|
+
left: `${x}px`,
|
|
56
|
+
top: `${y}px`,
|
|
57
|
+
transform: `translate(-50%, -50%) scale(${scale})${this.#orientToVelocity ? ` rotate(${angle}rad)` : ''}`,
|
|
58
|
+
opacity: `${this.#startAlpha ?? 1}`,
|
|
59
|
+
display: 'block',
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
else {
|
|
63
|
+
// 풀이 비어있으면 새로 생성
|
|
64
|
+
el = document.createElement('div');
|
|
57
65
|
setStyle(el, {
|
|
58
66
|
position: 'absolute',
|
|
59
67
|
left: `${x}px`,
|
|
@@ -67,37 +75,80 @@ export class DomParticleSystem extends DomGameObject {
|
|
|
67
75
|
opacity: `${this.#startAlpha ?? 1}`,
|
|
68
76
|
mixBlendMode: this.#blendMode ?? 'normal',
|
|
69
77
|
});
|
|
78
|
+
this.el.appendChild(el);
|
|
79
|
+
}
|
|
80
|
+
return el;
|
|
81
|
+
}
|
|
82
|
+
// [성능 최적화] 엘리먼트를 풀로 반환 (DOM에서 제거 대신)
|
|
83
|
+
#releaseElement(el) {
|
|
84
|
+
if (this.#elementPool.length < this.#poolSize) {
|
|
85
|
+
el.style.display = 'none';
|
|
86
|
+
this.#elementPool.push(el);
|
|
87
|
+
}
|
|
88
|
+
else {
|
|
89
|
+
el.remove();
|
|
90
|
+
}
|
|
91
|
+
}
|
|
92
|
+
async burst({ x, y }) {
|
|
93
|
+
if (!this.#texture)
|
|
94
|
+
await this.#loadTexturePromise;
|
|
95
|
+
const count = random(this.#count.min, this.#count.max);
|
|
96
|
+
for (let i = 0; i < count; i++) {
|
|
97
|
+
const lifespan = random(this.#lifespan.min, this.#lifespan.max);
|
|
98
|
+
const angle = random(this.#angle.min, this.#angle.max);
|
|
99
|
+
const sin = Math.sin(angle);
|
|
100
|
+
const cos = Math.cos(angle);
|
|
101
|
+
const velocity = random(this.#velocity.min, this.#velocity.max);
|
|
102
|
+
const scale = random(this.#scale.min, this.#scale.max);
|
|
103
|
+
const el = this.#acquireElement(x, y, scale, angle);
|
|
70
104
|
this.#particles.push({
|
|
71
105
|
el,
|
|
106
|
+
active: true,
|
|
107
|
+
x,
|
|
108
|
+
y,
|
|
109
|
+
opacity: this.#startAlpha ?? 1,
|
|
72
110
|
age: 0,
|
|
73
111
|
lifespan,
|
|
74
112
|
velocityX: velocity * cos,
|
|
75
113
|
velocityY: velocity * sin,
|
|
76
114
|
fadeRate: this.#fadeRate,
|
|
77
115
|
});
|
|
78
|
-
this.el.appendChild(el);
|
|
79
116
|
}
|
|
80
117
|
}
|
|
81
118
|
update(dt) {
|
|
82
119
|
super.update(dt);
|
|
83
120
|
const ps = this.#particles;
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
121
|
+
// [성능 최적화] swap-and-pop 패턴으로 O(n) splice 비용 제거
|
|
122
|
+
let writeIdx = 0;
|
|
123
|
+
for (let readIdx = 0; readIdx < ps.length; readIdx++) {
|
|
124
|
+
const p = ps[readIdx];
|
|
87
125
|
p.age += dt;
|
|
88
126
|
if (p.age > p.lifespan) {
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
127
|
+
// [성능 최적화] DOM에서 제거 대신 풀로 반환
|
|
128
|
+
this.#releaseElement(p.el);
|
|
129
|
+
p.active = false;
|
|
92
130
|
continue;
|
|
93
131
|
}
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
132
|
+
// [성능 최적화] parseFloat 대신 캐시된 값 사용
|
|
133
|
+
p.x += p.velocityX * dt;
|
|
134
|
+
p.y += p.velocityY * dt;
|
|
135
|
+
p.opacity += p.fadeRate * dt;
|
|
136
|
+
setStyle(p.el, { left: `${p.x}px`, top: `${p.y}px`, opacity: `${p.opacity}` });
|
|
137
|
+
// 활성 파티클을 앞으로 이동
|
|
138
|
+
if (writeIdx !== readIdx) {
|
|
139
|
+
ps[writeIdx] = p;
|
|
140
|
+
}
|
|
141
|
+
writeIdx++;
|
|
98
142
|
}
|
|
143
|
+
// 비활성 파티클 제거 (한 번에 배열 크기 조정)
|
|
144
|
+
ps.length = writeIdx;
|
|
99
145
|
}
|
|
100
146
|
remove() {
|
|
147
|
+
// 풀에 있는 엘리먼트도 정리
|
|
148
|
+
for (const el of this.#elementPool) {
|
|
149
|
+
el.remove();
|
|
150
|
+
}
|
|
151
|
+
this.#elementPool.length = 0;
|
|
101
152
|
domTextureLoader.release(this.#textureSrc);
|
|
102
153
|
super.remove();
|
|
103
154
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dom-particle.js","sourceRoot":"","sources":["../../src/dom/dom-particle.ts"],"names":[],"mappings":"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","sourcesContent":["import { BLEND_MODES } from 'pixi.js'\nimport { DomGameObject, DomGameObjectOptions } from './dom-game-object'\nimport { domTextureLoader } from './dom-texture-loader'\nimport { setStyle } from './dom-utils'\n\ntype RandomRange = { min: number, max: number }\n\nexport type DomParticleSystemOptions = {\n texture: string\n\n count: RandomRange\n lifespan: RandomRange\n angle: RandomRange\n velocity: RandomRange\n particleScale: RandomRange\n\n startAlpha?: number\n fadeRate: number\n orientToVelocity: boolean\n\n blendMode?: BLEND_MODES // ex) 'screen', 'multiply'\n} & DomGameObjectOptions\n\ninterface Particle {\n el: HTMLDivElement\n\n age: number\n lifespan: number\n\n velocityX: number\n velocityY: number\n\n fadeRate: number\n}\n\nfunction random(min: number, max: number) {\n return Math.random() * (max - min) + min\n}\n\nexport class DomParticleSystem extends DomGameObject {\n #textureSrc: string\n #count: RandomRange\n #lifespan: RandomRange\n #angle: RandomRange\n #velocity: RandomRange\n #scale: RandomRange\n #startAlpha?: number\n #fadeRate: number\n #orientToVelocity: boolean\n #blendMode?: BLEND_MODES\n\n #texture?: HTMLImageElement\n #loadTexturePromise: Promise<void>\n #particles: Particle[] = []\n\n constructor(options: DomParticleSystemOptions) {\n super(options)\n this.el.style.pointerEvents = 'none'\n\n this.#textureSrc = options.texture\n this.#count = options.count\n this.#lifespan = options.lifespan\n this.#angle = options.angle\n this.#velocity = options.velocity\n this.#scale = options.particleScale\n this.#startAlpha = options.startAlpha\n this.#fadeRate = options.fadeRate\n this.#orientToVelocity = options.orientToVelocity\n this.#blendMode = options.blendMode\n\n this.#loadTexturePromise = this.#loadTexture()\n }\n\n async #loadTexture() {\n if (domTextureLoader.checkCached(this.#textureSrc)) {\n this.#texture = domTextureLoader.getCached(this.#textureSrc)\n } else {\n console.info(`Dom texture not preloaded. Loading now: ${this.#textureSrc}`)\n this.#texture = await domTextureLoader.load(this.#textureSrc)\n }\n }\n\n async burst({ x, y }: { x: number; y: number }) {\n if (!this.#texture) await this.#loadTexturePromise\n\n const count = random(this.#count.min, this.#count.max)\n for (let i = 0; i < count; i++) {\n const lifespan = random(this.#lifespan.min, this.#lifespan.max)\n const angle = random(this.#angle.min, this.#angle.max)\n const sin = Math.sin(angle)\n const cos = Math.cos(angle)\n const velocity = random(this.#velocity.min, this.#velocity.max)\n const scale = random(this.#scale.min, this.#scale.max)\n\n const el = document.createElement('div')\n setStyle(el, {\n position: 'absolute',\n left: `${x}px`,\n top: `${y}px`,\n width: `${this.#texture!.width}px`,\n height: `${this.#texture!.height}px`,\n transform: `translate(-50%, -50%) scale(${scale})${this.#orientToVelocity ? ` rotate(${angle}rad)` : ''}`,\n backgroundImage: `url(${this.#textureSrc})`,\n backgroundSize: 'contain',\n backgroundRepeat: 'no-repeat',\n opacity: `${this.#startAlpha ?? 1}`,\n mixBlendMode: this.#blendMode ?? 'normal',\n })\n\n this.#particles.push({\n el,\n age: 0,\n lifespan,\n velocityX: velocity * cos,\n velocityY: velocity * sin,\n fadeRate: this.#fadeRate,\n })\n\n this.el.appendChild(el)\n }\n }\n\n protected override update(dt: number) {\n super.update(dt)\n\n const ps = this.#particles\n for (let i = 0; i < ps.length; i++) {\n const p = ps[i]\n const e = p.el\n\n p.age += dt\n if (p.age > p.lifespan) {\n e.remove()\n ps.splice(i, 1)\n i--\n continue\n }\n\n const x = parseFloat(e.style.left) + p.velocityX * dt\n const y = parseFloat(e.style.top) + p.velocityY * dt\n const opacity = parseFloat(e.style.opacity) + p.fadeRate * dt\n\n setStyle(e, { left: `${x}px`, top: `${y}px`, opacity: `${opacity}` })\n }\n }\n\n override remove() {\n domTextureLoader.release(this.#textureSrc)\n super.remove()\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"dom-particle.js","sourceRoot":"","sources":["../../src/dom/dom-particle.ts"],"names":[],"mappings":"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","sourcesContent":["import { BLEND_MODES } from 'pixi.js'\nimport { DomGameObject, DomGameObjectOptions } from './dom-game-object'\nimport { domTextureLoader } from './dom-texture-loader'\nimport { setStyle } from './dom-utils'\n\ntype RandomRange = { min: number, max: number }\n\nexport type DomParticleSystemOptions = {\n texture: string\n\n count: RandomRange\n lifespan: RandomRange\n angle: RandomRange\n velocity: RandomRange\n particleScale: RandomRange\n\n startAlpha?: number\n fadeRate: number\n orientToVelocity: boolean\n\n blendMode?: BLEND_MODES // ex) 'screen', 'multiply'\n\n // [성능 최적화] 오브젝트 풀 크기 설정 (기본값: 100)\n poolSize?: number\n} & DomGameObjectOptions\n\ninterface Particle {\n el: HTMLDivElement\n\n // [성능 최적화] 활성 상태 플래그 및 위치/투명도 캐시\n active: boolean\n x: number\n y: number\n opacity: number\n\n age: number\n lifespan: number\n\n velocityX: number\n velocityY: number\n\n fadeRate: number\n}\n\nfunction random(min: number, max: number) {\n return Math.random() * (max - min) + min\n}\n\nexport class DomParticleSystem extends DomGameObject {\n #textureSrc: string\n #count: RandomRange\n #lifespan: RandomRange\n #angle: RandomRange\n #velocity: RandomRange\n #scale: RandomRange\n #startAlpha?: number\n #fadeRate: number\n #orientToVelocity: boolean\n #blendMode?: BLEND_MODES\n\n #texture?: HTMLImageElement\n #loadTexturePromise: Promise<void>\n #particles: Particle[] = []\n\n // [성능 최적화] DOM 엘리먼트 풀 - 재사용으로 DOM 조작 및 GC 부담 감소\n #elementPool: HTMLDivElement[] = []\n #poolSize: number\n\n constructor(options: DomParticleSystemOptions) {\n super(options)\n this.el.style.pointerEvents = 'none'\n\n this.#textureSrc = options.texture\n this.#count = options.count\n this.#lifespan = options.lifespan\n this.#angle = options.angle\n this.#velocity = options.velocity\n this.#scale = options.particleScale\n this.#startAlpha = options.startAlpha\n this.#fadeRate = options.fadeRate\n this.#orientToVelocity = options.orientToVelocity\n this.#blendMode = options.blendMode\n this.#poolSize = options.poolSize ?? 100\n\n this.#loadTexturePromise = this.#loadTexture()\n }\n\n async #loadTexture() {\n if (domTextureLoader.checkCached(this.#textureSrc)) {\n this.#texture = domTextureLoader.getCached(this.#textureSrc)\n } else {\n console.info(`Dom texture not preloaded. Loading now: ${this.#textureSrc}`)\n this.#texture = await domTextureLoader.load(this.#textureSrc)\n }\n }\n\n // [성능 최적화] 풀에서 엘리먼트 가져오거나 새로 생성\n #acquireElement(x: number, y: number, scale: number, angle: number): HTMLDivElement {\n let el = this.#elementPool.pop()\n\n if (el) {\n // 풀에서 가져온 엘리먼트 재설정\n setStyle(el, {\n left: `${x}px`,\n top: `${y}px`,\n transform: `translate(-50%, -50%) scale(${scale})${this.#orientToVelocity ? ` rotate(${angle}rad)` : ''}`,\n opacity: `${this.#startAlpha ?? 1}`,\n display: 'block',\n })\n } else {\n // 풀이 비어있으면 새로 생성\n el = document.createElement('div')\n setStyle(el, {\n position: 'absolute',\n left: `${x}px`,\n top: `${y}px`,\n width: `${this.#texture!.width}px`,\n height: `${this.#texture!.height}px`,\n transform: `translate(-50%, -50%) scale(${scale})${this.#orientToVelocity ? ` rotate(${angle}rad)` : ''}`,\n backgroundImage: `url(${this.#textureSrc})`,\n backgroundSize: 'contain',\n backgroundRepeat: 'no-repeat',\n opacity: `${this.#startAlpha ?? 1}`,\n mixBlendMode: this.#blendMode ?? 'normal',\n })\n this.el.appendChild(el)\n }\n\n return el\n }\n\n // [성능 최적화] 엘리먼트를 풀로 반환 (DOM에서 제거 대신)\n #releaseElement(el: HTMLDivElement) {\n if (this.#elementPool.length < this.#poolSize) {\n el.style.display = 'none'\n this.#elementPool.push(el)\n } else {\n el.remove()\n }\n }\n\n async burst({ x, y }: { x: number; y: number }) {\n if (!this.#texture) await this.#loadTexturePromise\n\n const count = random(this.#count.min, this.#count.max)\n for (let i = 0; i < count; i++) {\n const lifespan = random(this.#lifespan.min, this.#lifespan.max)\n const angle = random(this.#angle.min, this.#angle.max)\n const sin = Math.sin(angle)\n const cos = Math.cos(angle)\n const velocity = random(this.#velocity.min, this.#velocity.max)\n const scale = random(this.#scale.min, this.#scale.max)\n\n const el = this.#acquireElement(x, y, scale, angle)\n\n this.#particles.push({\n el,\n active: true,\n x,\n y,\n opacity: this.#startAlpha ?? 1,\n age: 0,\n lifespan,\n velocityX: velocity * cos,\n velocityY: velocity * sin,\n fadeRate: this.#fadeRate,\n })\n }\n }\n\n protected override update(dt: number) {\n super.update(dt)\n\n const ps = this.#particles\n\n // [성능 최적화] swap-and-pop 패턴으로 O(n) splice 비용 제거\n let writeIdx = 0\n for (let readIdx = 0; readIdx < ps.length; readIdx++) {\n const p = ps[readIdx]\n\n p.age += dt\n\n if (p.age > p.lifespan) {\n // [성능 최적화] DOM에서 제거 대신 풀로 반환\n this.#releaseElement(p.el)\n p.active = false\n continue\n }\n\n // [성능 최적화] parseFloat 대신 캐시된 값 사용\n p.x += p.velocityX * dt\n p.y += p.velocityY * dt\n p.opacity += p.fadeRate * dt\n\n setStyle(p.el, { left: `${p.x}px`, top: `${p.y}px`, opacity: `${p.opacity}` })\n\n // 활성 파티클을 앞으로 이동\n if (writeIdx !== readIdx) {\n ps[writeIdx] = p\n }\n writeIdx++\n }\n\n // 비활성 파티클 제거 (한 번에 배열 크기 조정)\n ps.length = writeIdx\n }\n\n override remove() {\n // 풀에 있는 엘리먼트도 정리\n for (const el of this.#elementPool) {\n el.remove()\n }\n this.#elementPool.length = 0\n\n domTextureLoader.release(this.#textureSrc)\n super.remove()\n }\n}\n"]}
|
|
@@ -2,7 +2,10 @@ import { Container as PixiContainer } from 'pixi.js';
|
|
|
2
2
|
import { TransformableNode } from './transformable';
|
|
3
3
|
export class GameObject extends TransformableNode {
|
|
4
4
|
constructor(options) {
|
|
5
|
-
|
|
5
|
+
// [성능 최적화] sortableChildren이 필요한 경우에만 활성화
|
|
6
|
+
// useYSort 사용 시 또는 명시적으로 요청한 경우에만 정렬 활성화
|
|
7
|
+
const needsSorting = options?.sortableChildren ?? options?.useYSort ?? false;
|
|
8
|
+
super(new PixiContainer({ sortableChildren: needsSorting }), options ?? {});
|
|
6
9
|
}
|
|
7
10
|
}
|
|
8
11
|
//# sourceMappingURL=game-object.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"game-object.js","sourceRoot":"","sources":["../../../src/node/core/game-object.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,IAAI,aAAa,EAAE,MAAM,SAAS,CAAA;AACpD,OAAO,EAAE,iBAAiB,EAA4B,MAAM,iBAAiB,CAAA;
|
|
1
|
+
{"version":3,"file":"game-object.js","sourceRoot":"","sources":["../../../src/node/core/game-object.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,IAAI,aAAa,EAAE,MAAM,SAAS,CAAA;AACpD,OAAO,EAAE,iBAAiB,EAA4B,MAAM,iBAAiB,CAAA;AAS7E,MAAM,OAAO,UAAoC,SAAQ,iBAAmC;IAC1F,YAAY,OAA2B;QACrC,0CAA0C;QAC1C,yCAAyC;QACzC,MAAM,YAAY,GAAG,OAAO,EAAE,gBAAgB,IAAI,OAAO,EAAE,QAAQ,IAAI,KAAK,CAAA;QAC5E,KAAK,CAAC,IAAI,aAAa,CAAC,EAAE,gBAAgB,EAAE,YAAY,EAAE,CAAC,EAAE,OAAO,IAAI,EAAE,CAAC,CAAA;IAC7E,CAAC;CACF","sourcesContent":["import { EventMap } from '@webtaku/event-emitter'\nimport { Container as PixiContainer } from 'pixi.js'\nimport { TransformableNode, TransformableNodeOptions } from './transformable'\n\nexport type GameObjectOptions = {\n // [성능 최적화] sortableChildren 선택적 활성화\n // 기본값: useYSort가 true이거나 drawOrder를 사용하는 경우에만 true\n // 모든 컨테이너에서 sortableChildren을 켜면 정렬 비용이 발생함\n sortableChildren?: boolean\n} & TransformableNodeOptions\n\nexport class GameObject<E extends EventMap = {}> extends TransformableNode<PixiContainer, E> {\n constructor(options?: GameObjectOptions) {\n // [성능 최적화] sortableChildren이 필요한 경우에만 활성화\n // useYSort 사용 시 또는 명시적으로 요청한 경우에만 정렬 활성화\n const needsSorting = options?.sortableChildren ?? options?.useYSort ?? false\n super(new PixiContainer({ sortableChildren: needsSorting }), options ?? {})\n }\n}\n"]}
|
|
@@ -39,17 +39,15 @@ export class RenderableNode extends GameNode {
|
|
|
39
39
|
this._pixiContainer.destroy({ children: true });
|
|
40
40
|
super.remove();
|
|
41
41
|
}
|
|
42
|
+
// [성능 최적화] 기존 2-pass → 1-pass로 통합
|
|
43
|
+
// 기존: _updateWorldTransform() + _resetWorldTransformDirty() 를 별도 호출
|
|
44
|
+
// 개선: 한 번의 순회에서 트랜스폼 업데이트와 dirty 리셋을 동시 처리
|
|
42
45
|
_updateWorldTransform() {
|
|
43
46
|
for (const child of this.children) {
|
|
44
47
|
if (isRenderableNode(child))
|
|
45
48
|
child._updateWorldTransform();
|
|
46
49
|
}
|
|
47
|
-
|
|
48
|
-
_resetWorldTransformDirty() {
|
|
49
|
-
for (const child of this.children) {
|
|
50
|
-
if (isRenderableNode(child))
|
|
51
|
-
child._resetWorldTransformDirty();
|
|
52
|
-
}
|
|
50
|
+
// [성능 최적화] dirty 리셋을 별도 pass 대신 여기서 바로 처리
|
|
53
51
|
this.worldTransform.resetDirty();
|
|
54
52
|
this.worldAlpha.resetDirty();
|
|
55
53
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"renderable.js","sourceRoot":"","sources":["../../../src/node/core/renderable.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAE5C,MAAM,UAAU,gBAAgB,CAAC,CAAU;IACzC,OAAQ,CAA6C,CAAC,cAAc,KAAK,SAAS,CAAA;AACpF,CAAC;AAED,MAAM,OAAgB,cAA4D,SAAQ,QAAW;IACnG,SAAS,CAAW;IACpB,cAAc,CAAG;IAEjB,cAAc,GAAG,IAAI,cAAc,EAAE,CAAA;IACrC,UAAU,GAAG,IAAI,WAAW,CAAC,CAAC,CAAC,CAAA;IAE/B,YAAY,aAAgB;QAC1B,KAAK,EAAE,CAAA;QACP,IAAI,CAAC,cAAc,GAAG,aAAa,CAAA;IACrC,CAAC;IAED,IAAc,QAAQ,CAAC,QAA8B;QACnD,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAA;QAEzB,KAAK,MAAM,KAAK,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClC,IAAI,gBAAgB,CAAC,KAAK,CAAC,EAAE,CAAC;gBAC5B,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAA;YAC3B,CAAC;QACH,CAAC;IACH,CAAC;IAED,IAAc,QAAQ;QACpB,OAAO,IAAI,CAAC,SAAS,CAAA;IACvB,CAAC;IAEQ,GAAG,CAAC,GAAG,QAA8B;QAC5C,KAAK,CAAC,GAAG,CAAC,GAAG,QAAQ,CAAC,CAAA;QAEtB,KAAK,MAAM,KAAK,IAAI,QAAQ,EAAE,CAAC;YAC7B,IAAI,gBAAgB,CAAC,KAAK,CAAC,EAAE,CAAC;gBAC5B,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,CAAA;gBAElD,SAAS;gBACT,IAAI,IAAI,CAAC,SAAS;oBAAE,KAAK,CAAC,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAA;YACrD,CAAC;QACH,CAAC;IACH,CAAC;IAEQ,MAAM;QACb,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAA;QAC/C,KAAK,CAAC,MAAM,EAAE,CAAA;IAChB,CAAC;IAED,
|
|
1
|
+
{"version":3,"file":"renderable.js","sourceRoot":"","sources":["../../../src/node/core/renderable.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAE5C,MAAM,UAAU,gBAAgB,CAAC,CAAU;IACzC,OAAQ,CAA6C,CAAC,cAAc,KAAK,SAAS,CAAA;AACpF,CAAC;AAED,MAAM,OAAgB,cAA4D,SAAQ,QAAW;IACnG,SAAS,CAAW;IACpB,cAAc,CAAG;IAEjB,cAAc,GAAG,IAAI,cAAc,EAAE,CAAA;IACrC,UAAU,GAAG,IAAI,WAAW,CAAC,CAAC,CAAC,CAAA;IAE/B,YAAY,aAAgB;QAC1B,KAAK,EAAE,CAAA;QACP,IAAI,CAAC,cAAc,GAAG,aAAa,CAAA;IACrC,CAAC;IAED,IAAc,QAAQ,CAAC,QAA8B;QACnD,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAA;QAEzB,KAAK,MAAM,KAAK,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClC,IAAI,gBAAgB,CAAC,KAAK,CAAC,EAAE,CAAC;gBAC5B,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAA;YAC3B,CAAC;QACH,CAAC;IACH,CAAC;IAED,IAAc,QAAQ;QACpB,OAAO,IAAI,CAAC,SAAS,CAAA;IACvB,CAAC;IAEQ,GAAG,CAAC,GAAG,QAA8B;QAC5C,KAAK,CAAC,GAAG,CAAC,GAAG,QAAQ,CAAC,CAAA;QAEtB,KAAK,MAAM,KAAK,IAAI,QAAQ,EAAE,CAAC;YAC7B,IAAI,gBAAgB,CAAC,KAAK,CAAC,EAAE,CAAC;gBAC5B,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,CAAA;gBAElD,SAAS;gBACT,IAAI,IAAI,CAAC,SAAS;oBAAE,KAAK,CAAC,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAA;YACrD,CAAC;QACH,CAAC;IACH,CAAC;IAEQ,MAAM;QACb,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAA;QAC/C,KAAK,CAAC,MAAM,EAAE,CAAA;IAChB,CAAC;IAED,kCAAkC;IAClC,oEAAoE;IACpE,2CAA2C;IAC3C,qBAAqB;QACnB,KAAK,MAAM,KAAK,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClC,IAAI,gBAAgB,CAAC,KAAK,CAAC;gBAAE,KAAK,CAAC,qBAAqB,EAAE,CAAA;QAC5D,CAAC;QAED,0CAA0C;QAC1C,IAAI,CAAC,cAAc,CAAC,UAAU,EAAE,CAAA;QAChC,IAAI,CAAC,UAAU,CAAC,UAAU,EAAE,CAAA;IAC9B,CAAC;IAED,IAAI,IAAI,CAAC,CAAC,IAAI,IAAI,CAAC,cAAc,CAAC,IAAI,GAAG,CAAC,CAAA,CAAC,CAAC;IAC5C,IAAI,IAAI,KAAK,OAAO,IAAI,CAAC,cAAc,CAAC,IAAI,CAAA,CAAC,CAAC;IAE9C,IAAI,KAAK,IAAI,CAAC,cAAc,CAAC,OAAO,GAAG,KAAK,CAAA,CAAC,CAAC;IAC9C,IAAI,KAAK,IAAI,CAAC,cAAc,CAAC,OAAO,GAAG,IAAI,CAAA,CAAC,CAAC;CAC9C","sourcesContent":["import { EventMap } from '@webtaku/event-emitter'\nimport { Container as PixiContainer } from 'pixi.js'\nimport { Renderer } from '../../renderer/renderer'\nimport { DirtyNumber } from './dirty-number'\nimport { GameNode } from './game-node'\nimport { WorldTransform } from './transform'\n\nexport function isRenderableNode(v: unknown): v is RenderableNode<PixiContainer, EventMap> {\n return (v as RenderableNode<PixiContainer, EventMap>).worldTransform !== undefined\n}\n\nexport abstract class RenderableNode<C extends PixiContainer, E extends EventMap> extends GameNode<E> {\n #renderer?: Renderer\n _pixiContainer: C\n\n worldTransform = new WorldTransform()\n worldAlpha = new DirtyNumber(1)\n\n constructor(pixiContainer: C) {\n super()\n this._pixiContainer = pixiContainer\n }\n\n protected set renderer(renderer: Renderer | undefined) {\n this.#renderer = renderer\n\n for (const child of this.children) {\n if (isRenderableNode(child)) {\n child.renderer = renderer\n }\n }\n }\n\n protected get renderer() {\n return this.#renderer\n }\n\n override add(...children: GameNode<EventMap>[]) {\n super.add(...children)\n\n for (const child of children) {\n if (isRenderableNode(child)) {\n this._pixiContainer.addChild(child._pixiContainer)\n\n // 렌더러 설정\n if (this.#renderer) child.renderer = this.#renderer\n }\n }\n }\n\n override remove() {\n this._pixiContainer.destroy({ children: true })\n super.remove()\n }\n\n // [성능 최적화] 기존 2-pass → 1-pass로 통합\n // 기존: _updateWorldTransform() + _resetWorldTransformDirty() 를 별도 호출\n // 개선: 한 번의 순회에서 트랜스폼 업데이트와 dirty 리셋을 동시 처리\n _updateWorldTransform() {\n for (const child of this.children) {\n if (isRenderableNode(child)) child._updateWorldTransform()\n }\n\n // [성능 최적화] dirty 리셋을 별도 pass 대신 여기서 바로 처리\n this.worldTransform.resetDirty()\n this.worldAlpha.resetDirty()\n }\n\n set tint(t) { this._pixiContainer.tint = t }\n get tint() { return this._pixiContainer.tint }\n\n hide() { this._pixiContainer.visible = false }\n show() { this._pixiContainer.visible = true }\n}\n"]}
|
|
@@ -5,6 +5,10 @@ export class TransformableNode extends RenderableNode {
|
|
|
5
5
|
alpha = 1;
|
|
6
6
|
#layer;
|
|
7
7
|
#useYSort = false;
|
|
8
|
+
// [성능 최적화] useYSort용 이전 y값 캐시 - y가 변할 때만 drawOrder 업데이트
|
|
9
|
+
#prevY = NaN;
|
|
10
|
+
// [성능 최적화] 이전 alpha 캐시 - 변경 시에만 Pixi에 반영
|
|
11
|
+
#prevAlpha = NaN;
|
|
8
12
|
constructor(pixiContainer, options) {
|
|
9
13
|
super(pixiContainer);
|
|
10
14
|
if (options.x !== undefined)
|
|
@@ -47,23 +51,50 @@ export class TransformableNode extends RenderableNode {
|
|
|
47
51
|
}
|
|
48
52
|
const pc = this._pixiContainer;
|
|
49
53
|
const renderer = this.renderer;
|
|
54
|
+
const wt = this.worldTransform;
|
|
50
55
|
// 레이어 상에 있는 경우, 독립적으로 업데이트
|
|
51
56
|
if (this.#layer && renderer) {
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
+
// [성능 최적화] dirty 체크 - 값이 변경된 경우에만 Pixi 속성 업데이트
|
|
58
|
+
// Pixi 내부에서도 dirty 체크를 하지만, 함수 호출 자체를 줄이는 것이 더 효율적
|
|
59
|
+
if (wt.x.dirty || wt.y.dirty) {
|
|
60
|
+
pc.position.set(wt.x.v, wt.y.v);
|
|
61
|
+
}
|
|
62
|
+
if (wt.scaleX.dirty || wt.scaleY.dirty) {
|
|
63
|
+
pc.scale.set(wt.scaleX.v, wt.scaleY.v);
|
|
64
|
+
}
|
|
65
|
+
if (wt.rotation.dirty) {
|
|
66
|
+
pc.rotation = wt.rotation.v;
|
|
67
|
+
}
|
|
68
|
+
if (this.worldAlpha.dirty) {
|
|
69
|
+
pc.alpha = this.worldAlpha.v;
|
|
70
|
+
}
|
|
57
71
|
}
|
|
58
72
|
else {
|
|
59
73
|
const lt = this.localTransform;
|
|
60
|
-
|
|
61
|
-
|
|
74
|
+
// [성능 최적화] 로컬 트랜스폼도 dirty 체크 적용
|
|
75
|
+
// DOM 쪽(dom-game-object.ts)과 동일한 패턴
|
|
76
|
+
if (wt.x.dirty || wt.y.dirty) {
|
|
77
|
+
pc.position.set(lt.x, lt.y);
|
|
78
|
+
}
|
|
79
|
+
// [성능 최적화] useYSort: y가 실제로 변경된 경우에만 drawOrder 업데이트
|
|
80
|
+
// 기존: 매 프레임 zIndex 설정 → 부모 컨테이너 정렬 비용 발생
|
|
81
|
+
// 개선: y 변경 시에만 zIndex 업데이트
|
|
82
|
+
if (this.#useYSort && lt.y !== this.#prevY) {
|
|
62
83
|
this.drawOrder = lt.y;
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
84
|
+
this.#prevY = lt.y;
|
|
85
|
+
}
|
|
86
|
+
if (wt.scaleX.dirty || wt.scaleY.dirty) {
|
|
87
|
+
pc.pivot.set(lt.pivotX, lt.pivotY);
|
|
88
|
+
pc.scale.set(lt.scaleX, lt.scaleY);
|
|
89
|
+
}
|
|
90
|
+
if (wt.rotation.dirty) {
|
|
91
|
+
pc.rotation = lt.rotation;
|
|
92
|
+
}
|
|
93
|
+
// [성능 최적화] alpha 변경 시에만 업데이트
|
|
94
|
+
if (this.alpha !== this.#prevAlpha) {
|
|
95
|
+
pc.alpha = this.alpha;
|
|
96
|
+
this.#prevAlpha = this.alpha;
|
|
97
|
+
}
|
|
67
98
|
}
|
|
68
99
|
super._updateWorldTransform();
|
|
69
100
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"transformable.js","sourceRoot":"","sources":["../../../src/node/core/transformable.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAkB5C,MAAM,OAAgB,iBAA+D,SAAQ,cAAoB;IACrG,cAAc,GAAG,IAAI,cAAc,EAAE,CAAA;IAE/C,KAAK,GAAG,CAAC,CAAA;IACT,MAAM,CAAS;IACf,SAAS,GAAG,KAAK,CAAA;IAEjB,YAAY,aAAgB,EAAE,OAAiC;QAC7D,KAAK,CAAC,aAAa,CAAC,CAAA;QAEpB,IAAI,OAAO,CAAC,CAAC,KAAK,SAAS;YAAE,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,CAAC,CAAA;QAC/C,IAAI,OAAO,CAAC,CAAC,KAAK,SAAS;YAAE,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,CAAC,CAAA;QAC/C,IAAI,OAAO,CAAC,KAAK,KAAK,SAAS;YAAE,IAAI,CAAC,KAAK,GAAG,OAAO,CAAC,KAAK,CAAA;QAC3D,IAAI,OAAO,CAAC,MAAM,KAAK,SAAS;YAAE,IAAI,CAAC,MAAM,GAAG,OAAO,CAAC,MAAM,CAAA;QAC9D,IAAI,OAAO,CAAC,MAAM,KAAK,SAAS;YAAE,IAAI,CAAC,MAAM,GAAG,OAAO,CAAC,MAAM,CAAA;QAC9D,IAAI,OAAO,CAAC,MAAM,KAAK,SAAS;YAAE,IAAI,CAAC,MAAM,GAAG,OAAO,CAAC,MAAM,CAAA;QAC9D,IAAI,OAAO,CAAC,MAAM,KAAK,SAAS;YAAE,IAAI,CAAC,MAAM,GAAG,OAAO,CAAC,MAAM,CAAA;QAC9D,IAAI,OAAO,CAAC,QAAQ,KAAK,SAAS;YAAE,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAC,QAAQ,CAAA;QACpE,IAAI,OAAO,CAAC,KAAK,KAAK,SAAS;YAAE,IAAI,CAAC,KAAK,GAAG,OAAO,CAAC,KAAK,CAAA;QAC3D,IAAI,OAAO,CAAC,SAAS,KAAK,SAAS;YAAE,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,SAAS,CAAA;QAEvE,IAAI,CAAC,MAAM,GAAG,OAAO,CAAC,KAAK,CAAA;QAC3B,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,QAAQ,IAAI,KAAK,CAAA;IAC5C,CAAC;IAED,IAAuB,QAAQ,CAAC,QAA8B;QAC5D,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAA;QAEzB,IAAI,IAAI,CAAC,MAAM,IAAI,QAAQ,EAAE,CAAC;YAC5B,QAAQ,CAAC,WAAW,CAAC,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,CAAA;QACzC,CAAC;IACH,CAAC;IAED,IAAuB,QAAQ;QAC7B,OAAO,KAAK,CAAC,QAAQ,CAAA;IACvB,CAAC;IAEQ,qBAAqB;QAC5B,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAA;QAC1B,IAAI,MAAM,IAAI,gBAAgB,CAAC,MAAM,CAAC,EAAE,CAAC;YACvC,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,MAAM,CAAC,cAAc,EAAE,IAAI,CAAC,cAAc,CAAC,CAAA;YACtE,IAAI,CAAC,UAAU,CAAC,CAAC,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAA;QACtD,CAAC;QAED,MAAM,EAAE,GAAG,IAAI,CAAC,cAAc,CAAA;QAC9B,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAA;QAE9B,2BAA2B;QAC3B,IAAI,IAAI,CAAC,MAAM,IAAI,QAAQ,EAAE,CAAC;YAC5B,MAAM,EAAE,GAAG,IAAI,CAAC,cAAc,CAAA;YAC9B,EAAE,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;YAC/B,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAA;YACtC,EAAE,CAAC,QAAQ,GAAG,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAA;YAC3B,EAAE,CAAC,KAAK,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,CAAA;QAC9B,CAAC;aAAM,CAAC;YACN,MAAM,EAAE,GAAG,IAAI,CAAC,cAAc,CAAA;YAC9B,EAAE,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAA;YAC3B,IAAI,IAAI,CAAC,SAAS;gBAAE,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC,CAAC,CAAA;YACzC,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,CAAA;YAClC,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,CAAA;YAClC,EAAE,CAAC,QAAQ,GAAG,EAAE,CAAC,QAAQ,CAAA;YACzB,EAAE,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAA;QACvB,CAAC;QAED,KAAK,CAAC,qBAAqB,EAAE,CAAA;IAC/B,CAAC;IAED,IAAI,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,cAAc,CAAC,CAAC,GAAG,CAAC,CAAA,CAAC,CAAC;IACtC,IAAI,CAAC,KAAK,OAAO,IAAI,CAAC,cAAc,CAAC,CAAC,CAAA,CAAC,CAAC;IAExC,IAAI,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,cAAc,CAAC,CAAC,GAAG,CAAC,CAAA,CAAC,CAAC;IACtC,IAAI,CAAC,KAAK,OAAO,IAAI,CAAC,cAAc,CAAC,CAAC,CAAA,CAAC,CAAC;IAExC,IAAI,KAAK,CAAC,CAAC,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,CAAA,CAAC,CAAC;IAC/E,IAAI,KAAK,KAAK,OAAO,IAAI,CAAC,cAAc,CAAC,MAAM,CAAA,CAAC,CAAC;IAEjD,IAAI,MAAM,CAAC,CAAC,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,CAAA,CAAC,CAAC;IAChD,IAAI,MAAM,KAAK,OAAO,IAAI,CAAC,cAAc,CAAC,MAAM,CAAA,CAAC,CAAC;IAElD,IAAI,MAAM,CAAC,CAAC,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,CAAA,CAAC,CAAC;IAChD,IAAI,MAAM,KAAK,OAAO,IAAI,CAAC,cAAc,CAAC,MAAM,CAAA,CAAC,CAAC;IAElD,IAAI,MAAM,CAAC,CAAC,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,CAAA,CAAC,CAAC;IAChD,IAAI,MAAM,KAAK,OAAO,IAAI,CAAC,cAAc,CAAC,MAAM,CAAA,CAAC,CAAC;IAElD,IAAI,MAAM,CAAC,CAAC,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,CAAA,CAAC,CAAC;IAChD,IAAI,MAAM,KAAK,OAAO,IAAI,CAAC,cAAc,CAAC,MAAM,CAAA,CAAC,CAAC;IAElD,IAAI,QAAQ,CAAC,CAAC,IAAI,IAAI,CAAC,cAAc,CAAC,QAAQ,GAAG,CAAC,CAAA,CAAC,CAAC;IACpD,IAAI,QAAQ,KAAK,OAAO,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAA,CAAC,CAAC;IAEtD,IAAI,SAAS,CAAC,CAAC,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,CAAA,CAAC,CAAC;IACnD,IAAI,SAAS,KAAK,OAAO,IAAI,CAAC,cAAc,CAAC,MAAM,CAAA,CAAC,CAAC;CACtD","sourcesContent":["import { EventMap } from '@webtaku/event-emitter'\nimport { Container as PixiContainer } from 'pixi.js'\nimport { Renderer } from '../../renderer/renderer'\nimport { isRenderableNode, RenderableNode } from './renderable'\nimport { LocalTransform } from './transform'\n\nexport type TransformableNodeOptions = {\n x?: number\n y?: number\n scale?: number\n scaleX?: number\n scaleY?: number\n pivotX?: number\n pivotY?: number\n rotation?: number\n drawOrder?: number\n\n alpha?: number\n layer?: string\n useYSort?: boolean\n}\n\nexport abstract class TransformableNode<C extends PixiContainer, E extends EventMap> extends RenderableNode<C, E> {\n protected localTransform = new LocalTransform()\n\n alpha = 1\n #layer?: string\n #useYSort = false\n\n constructor(pixiContainer: C, options: TransformableNodeOptions) {\n super(pixiContainer)\n\n if (options.x !== undefined) this.x = options.x\n if (options.y !== undefined) this.y = options.y\n if (options.scale !== undefined) this.scale = options.scale\n if (options.scaleX !== undefined) this.scaleX = options.scaleX\n if (options.scaleY !== undefined) this.scaleY = options.scaleY\n if (options.pivotX !== undefined) this.pivotX = options.pivotX\n if (options.pivotY !== undefined) this.pivotY = options.pivotY\n if (options.rotation !== undefined) this.rotation = options.rotation\n if (options.alpha !== undefined) this.alpha = options.alpha\n if (options.drawOrder !== undefined) this.drawOrder = options.drawOrder\n\n this.#layer = options.layer\n this.#useYSort = options.useYSort ?? false\n }\n\n protected override set renderer(renderer: Renderer | undefined) {\n super.renderer = renderer\n\n if (this.#layer && renderer) {\n renderer._addToLayer(this, this.#layer)\n }\n }\n\n protected override get renderer() {\n return super.renderer\n }\n\n override _updateWorldTransform() {\n const parent = this.parent\n if (parent && isRenderableNode(parent)) {\n this.worldTransform.update(parent.worldTransform, this.localTransform)\n this.worldAlpha.v = parent.worldAlpha.v * this.alpha\n }\n\n const pc = this._pixiContainer\n const renderer = this.renderer\n\n // 레이어 상에 있는 경우, 독립적으로 업데이트\n if (this.#layer && renderer) {\n const wt = this.worldTransform\n pc.position.set(wt.x.v, wt.y.v)\n pc.scale.set(wt.scaleX.v, wt.scaleY.v)\n pc.rotation = wt.rotation.v\n pc.alpha = this.worldAlpha.v\n } else {\n const lt = this.localTransform\n pc.position.set(lt.x, lt.y)\n if (this.#useYSort) this.drawOrder = lt.y\n pc.pivot.set(lt.pivotX, lt.pivotY)\n pc.scale.set(lt.scaleX, lt.scaleY)\n pc.rotation = lt.rotation\n pc.alpha = this.alpha\n }\n\n super._updateWorldTransform()\n }\n\n set x(v) { this.localTransform.x = v }\n get x() { return this.localTransform.x }\n\n set y(v) { this.localTransform.y = v }\n get y() { return this.localTransform.y }\n\n set scale(v) { this.localTransform.scaleX = v; this.localTransform.scaleY = v }\n get scale() { return this.localTransform.scaleX }\n\n set scaleX(v) { this.localTransform.scaleX = v }\n get scaleX() { return this.localTransform.scaleX }\n\n set scaleY(v) { this.localTransform.scaleY = v }\n get scaleY() { return this.localTransform.scaleY }\n\n set pivotX(v) { this.localTransform.pivotX = v }\n get pivotX() { return this.localTransform.pivotX }\n\n set pivotY(v) { this.localTransform.pivotY = v }\n get pivotY() { return this.localTransform.pivotY }\n\n set rotation(v) { this.localTransform.rotation = v }\n get rotation() { return this.localTransform.rotation }\n\n set drawOrder(v) { this._pixiContainer.zIndex = v }\n get drawOrder() { return this._pixiContainer.zIndex }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"transformable.js","sourceRoot":"","sources":["../../../src/node/core/transformable.ts"],"names":[],"mappings":"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","sourcesContent":["import { EventMap } from '@webtaku/event-emitter'\nimport { Container as PixiContainer } from 'pixi.js'\nimport { Renderer } from '../../renderer/renderer'\nimport { isRenderableNode, RenderableNode } from './renderable'\nimport { LocalTransform } from './transform'\n\nexport type TransformableNodeOptions = {\n x?: number\n y?: number\n scale?: number\n scaleX?: number\n scaleY?: number\n pivotX?: number\n pivotY?: number\n rotation?: number\n drawOrder?: number\n\n alpha?: number\n layer?: string\n useYSort?: boolean\n}\n\nexport abstract class TransformableNode<C extends PixiContainer, E extends EventMap> extends RenderableNode<C, E> {\n protected localTransform = new LocalTransform()\n\n alpha = 1\n #layer?: string\n #useYSort = false\n\n // [성능 최적화] useYSort용 이전 y값 캐시 - y가 변할 때만 drawOrder 업데이트\n #prevY = NaN\n\n // [성능 최적화] 이전 alpha 캐시 - 변경 시에만 Pixi에 반영\n #prevAlpha = NaN\n\n constructor(pixiContainer: C, options: TransformableNodeOptions) {\n super(pixiContainer)\n\n if (options.x !== undefined) this.x = options.x\n if (options.y !== undefined) this.y = options.y\n if (options.scale !== undefined) this.scale = options.scale\n if (options.scaleX !== undefined) this.scaleX = options.scaleX\n if (options.scaleY !== undefined) this.scaleY = options.scaleY\n if (options.pivotX !== undefined) this.pivotX = options.pivotX\n if (options.pivotY !== undefined) this.pivotY = options.pivotY\n if (options.rotation !== undefined) this.rotation = options.rotation\n if (options.alpha !== undefined) this.alpha = options.alpha\n if (options.drawOrder !== undefined) this.drawOrder = options.drawOrder\n\n this.#layer = options.layer\n this.#useYSort = options.useYSort ?? false\n }\n\n protected override set renderer(renderer: Renderer | undefined) {\n super.renderer = renderer\n\n if (this.#layer && renderer) {\n renderer._addToLayer(this, this.#layer)\n }\n }\n\n protected override get renderer() {\n return super.renderer\n }\n\n override _updateWorldTransform() {\n const parent = this.parent\n if (parent && isRenderableNode(parent)) {\n this.worldTransform.update(parent.worldTransform, this.localTransform)\n this.worldAlpha.v = parent.worldAlpha.v * this.alpha\n }\n\n const pc = this._pixiContainer\n const renderer = this.renderer\n const wt = this.worldTransform\n\n // 레이어 상에 있는 경우, 독립적으로 업데이트\n if (this.#layer && renderer) {\n // [성능 최적화] dirty 체크 - 값이 변경된 경우에만 Pixi 속성 업데이트\n // Pixi 내부에서도 dirty 체크를 하지만, 함수 호출 자체를 줄이는 것이 더 효율적\n if (wt.x.dirty || wt.y.dirty) {\n pc.position.set(wt.x.v, wt.y.v)\n }\n if (wt.scaleX.dirty || wt.scaleY.dirty) {\n pc.scale.set(wt.scaleX.v, wt.scaleY.v)\n }\n if (wt.rotation.dirty) {\n pc.rotation = wt.rotation.v\n }\n if (this.worldAlpha.dirty) {\n pc.alpha = this.worldAlpha.v\n }\n } else {\n const lt = this.localTransform\n\n // [성능 최적화] 로컬 트랜스폼도 dirty 체크 적용\n // DOM 쪽(dom-game-object.ts)과 동일한 패턴\n if (wt.x.dirty || wt.y.dirty) {\n pc.position.set(lt.x, lt.y)\n }\n\n // [성능 최적화] useYSort: y가 실제로 변경된 경우에만 drawOrder 업데이트\n // 기존: 매 프레임 zIndex 설정 → 부모 컨테이너 정렬 비용 발생\n // 개선: y 변경 시에만 zIndex 업데이트\n if (this.#useYSort && lt.y !== this.#prevY) {\n this.drawOrder = lt.y\n this.#prevY = lt.y\n }\n\n if (wt.scaleX.dirty || wt.scaleY.dirty) {\n pc.pivot.set(lt.pivotX, lt.pivotY)\n pc.scale.set(lt.scaleX, lt.scaleY)\n }\n if (wt.rotation.dirty) {\n pc.rotation = lt.rotation\n }\n\n // [성능 최적화] alpha 변경 시에만 업데이트\n if (this.alpha !== this.#prevAlpha) {\n pc.alpha = this.alpha\n this.#prevAlpha = this.alpha\n }\n }\n\n super._updateWorldTransform()\n }\n\n set x(v) { this.localTransform.x = v }\n get x() { return this.localTransform.x }\n\n set y(v) { this.localTransform.y = v }\n get y() { return this.localTransform.y }\n\n set scale(v) { this.localTransform.scaleX = v; this.localTransform.scaleY = v }\n get scale() { return this.localTransform.scaleX }\n\n set scaleX(v) { this.localTransform.scaleX = v }\n get scaleX() { return this.localTransform.scaleX }\n\n set scaleY(v) { this.localTransform.scaleY = v }\n get scaleY() { return this.localTransform.scaleY }\n\n set pivotX(v) { this.localTransform.pivotX = v }\n get pivotX() { return this.localTransform.pivotX }\n\n set pivotY(v) { this.localTransform.pivotY = v }\n get pivotY() { return this.localTransform.pivotY }\n\n set rotation(v) { this.localTransform.rotation = v }\n get rotation() { return this.localTransform.rotation }\n\n set drawOrder(v) { this._pixiContainer.zIndex = v }\n get drawOrder() { return this._pixiContainer.zIndex }\n}\n"]}
|
|
@@ -9,6 +9,8 @@ export class AnimatedSpriteNode extends GameObject {
|
|
|
9
9
|
#sheet;
|
|
10
10
|
#sprite;
|
|
11
11
|
#baseFps = 60;
|
|
12
|
+
// [성능 최적화] 이전 worldTimeScale 캐시 - 변경 시에만 animationSpeed 업데이트
|
|
13
|
+
#prevWorldTimeScale = NaN;
|
|
12
14
|
constructor(options) {
|
|
13
15
|
super(options);
|
|
14
16
|
this.#src = options.src;
|
|
@@ -43,6 +45,7 @@ export class AnimatedSpriteNode extends GameObject {
|
|
|
43
45
|
s.loop = a.loop;
|
|
44
46
|
this.#baseFps = a.fps;
|
|
45
47
|
s.animationSpeed = (a.fps / 60) * this.worldTimeScale;
|
|
48
|
+
this.#prevWorldTimeScale = this.worldTimeScale;
|
|
46
49
|
s.play();
|
|
47
50
|
s.onLoop = () => this.emit('animationend', this.#animation);
|
|
48
51
|
s.onComplete = () => this.emit('animationend', this.#animation);
|
|
@@ -74,8 +77,12 @@ export class AnimatedSpriteNode extends GameObject {
|
|
|
74
77
|
get animation() { return this.#animation; }
|
|
75
78
|
update(dt) {
|
|
76
79
|
super.update(dt);
|
|
77
|
-
|
|
80
|
+
// [성능 최적화] worldTimeScale이 변경된 경우에만 animationSpeed 업데이트
|
|
81
|
+
// 기존: 매 프레임 animationSpeed 재설정
|
|
82
|
+
// 개선: 캐시된 값과 비교하여 변경 시에만 업데이트
|
|
83
|
+
if (this.#sprite && this.worldTimeScale !== this.#prevWorldTimeScale) {
|
|
78
84
|
this.#sprite.animationSpeed = (this.#baseFps / 60) * this.worldTimeScale;
|
|
85
|
+
this.#prevWorldTimeScale = this.worldTimeScale;
|
|
79
86
|
}
|
|
80
87
|
}
|
|
81
88
|
remove() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"animated-sprite.js","sourceRoot":"","sources":["../../../src/node/ext/animated-sprite.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"animated-sprite.js","sourceRoot":"","sources":["../../../src/node/ext/animated-sprite.ts"],"names":[],"mappings":"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","sourcesContent":["import { EventMap } from '@webtaku/event-emitter'\nimport { AnimatedSprite as PixiAnimatedSprite, Spritesheet } from 'pixi.js'\nimport { getCachedAtlasId, spritesheetLoader } from '../../asset/loaders/spritesheet'\nimport { Atlas } from '../../types/atlas'\nimport { GameObject, GameObjectOptions } from '../core/game-object'\n\nexport type AnimatedSpriteNodeOptions = {\n src: string\n atlas: Atlas\n animation: string\n} & GameObjectOptions\n\nexport class AnimatedSpriteNode<E extends EventMap = {}> extends GameObject<E & {\n animationend: (animation: string) => void\n}> {\n #src: string\n #atlas: Atlas\n #animation: string\n\n #atlasId!: string\n #sheet?: Spritesheet\n #sprite?: PixiAnimatedSprite\n #baseFps = 60\n\n // [성능 최적화] 이전 worldTimeScale 캐시 - 변경 시에만 animationSpeed 업데이트\n #prevWorldTimeScale = NaN\n\n constructor(options: AnimatedSpriteNodeOptions) {\n super(options)\n this.#src = options.src\n this.#atlas = options.atlas\n this.#animation = options.animation\n this.#load()\n }\n\n async #load() {\n this.#atlasId = getCachedAtlasId(this.#src, this.#atlas)\n\n if (spritesheetLoader.checkCached(this.#atlasId)) {\n this.#sheet = spritesheetLoader.getCached(this.#atlasId)\n } else {\n console.info(`Spritesheet not preloaded. Loading now: ${this.#atlasId}`)\n this.#sheet = await spritesheetLoader.load(this.#atlasId, this.#src, this.#atlas)\n }\n\n this.#updateAnimation()\n }\n\n #updateAnimation() {\n this.#sprite?.destroy()\n this.#sprite = undefined\n\n if (!this.#sheet) return\n\n if (!this.#sheet.animations[this.#animation]) {\n console.error(`Animation not found: ${this.#animation}`)\n return\n }\n\n const a = this.#atlas.animations[this.#animation]\n const s = new PixiAnimatedSprite(this.#sheet.animations[this.#animation])\n\n s.anchor.set(0.5, 0.5)\n s.zIndex = -999999\n s.loop = a.loop\n this.#baseFps = a.fps\n s.animationSpeed = (a.fps / 60) * this.worldTimeScale\n this.#prevWorldTimeScale = this.worldTimeScale\n s.play()\n s.onLoop = () => (this as any).emit('animationend', this.#animation)\n s.onComplete = () => (this as any).emit('animationend', this.#animation)\n\n this._pixiContainer.addChild(s)\n this.#sprite = s\n }\n\n set src(src) {\n if (this.#src !== src) {\n spritesheetLoader.release(this.#atlasId)\n this.#src = src\n this.#load()\n }\n }\n\n get src() { return this.#src }\n\n set atlas(atlas) {\n if (this.#atlas !== atlas) {\n spritesheetLoader.release(this.#atlasId)\n this.#atlas = atlas\n this.#load()\n }\n }\n\n get atlas() { return this.#atlas }\n\n set animation(animation) {\n if (this.#animation !== animation) {\n this.#animation = animation\n this.#updateAnimation()\n }\n }\n\n get animation() { return this.#animation }\n\n protected override update(dt: number) {\n super.update(dt)\n\n // [성능 최적화] worldTimeScale이 변경된 경우에만 animationSpeed 업데이트\n // 기존: 매 프레임 animationSpeed 재설정\n // 개선: 캐시된 값과 비교하여 변경 시에만 업데이트\n if (this.#sprite && this.worldTimeScale !== this.#prevWorldTimeScale) {\n this.#sprite.animationSpeed = (this.#baseFps / 60) * this.worldTimeScale\n this.#prevWorldTimeScale = this.worldTimeScale\n }\n }\n\n override remove() {\n spritesheetLoader.release(this.#atlasId)\n super.remove()\n }\n}\n"]}
|
|
@@ -7,6 +7,11 @@ export class BitmapTextNode extends GameObject {
|
|
|
7
7
|
#text;
|
|
8
8
|
#font;
|
|
9
9
|
#sprites = [];
|
|
10
|
+
// [성능 최적화] 글리프 텍스처 캐시 - charCode → PixiTexture 매핑
|
|
11
|
+
// 동일 폰트에서 같은 문자에 대해 텍스처를 재생성하지 않음
|
|
12
|
+
#glyphTextureCache = new Map();
|
|
13
|
+
// [성능 최적화] 스프라이트 풀 - 재사용으로 GC 부담 감소
|
|
14
|
+
#spritePool = [];
|
|
10
15
|
constructor(options) {
|
|
11
16
|
super(options);
|
|
12
17
|
this.#fnt = options.fnt;
|
|
@@ -14,9 +19,43 @@ export class BitmapTextNode extends GameObject {
|
|
|
14
19
|
this.#text = options.text;
|
|
15
20
|
this.#load();
|
|
16
21
|
}
|
|
22
|
+
// [성능 최적화] 글리프 텍스처 가져오기 (캐시 활용)
|
|
23
|
+
#getGlyphTexture(charCode) {
|
|
24
|
+
if (!this.#font)
|
|
25
|
+
return undefined;
|
|
26
|
+
let texture = this.#glyphTextureCache.get(charCode);
|
|
27
|
+
if (texture)
|
|
28
|
+
return texture;
|
|
29
|
+
const c = this.#font.chars[charCode];
|
|
30
|
+
if (!c)
|
|
31
|
+
return undefined;
|
|
32
|
+
const frame = new PixiRectangle(c.x, c.y, c.width, c.height);
|
|
33
|
+
texture = new PixiTexture({ source: this.#font.texture.source, frame });
|
|
34
|
+
this.#glyphTextureCache.set(charCode, texture);
|
|
35
|
+
return texture;
|
|
36
|
+
}
|
|
37
|
+
// [성능 최적화] 풀에서 스프라이트 가져오거나 새로 생성
|
|
38
|
+
#acquireSprite(texture) {
|
|
39
|
+
let sprite = this.#spritePool.pop();
|
|
40
|
+
if (sprite) {
|
|
41
|
+
sprite.texture = texture;
|
|
42
|
+
sprite.visible = true;
|
|
43
|
+
}
|
|
44
|
+
else {
|
|
45
|
+
sprite = new PixiSprite({ texture, zIndex: -999999 });
|
|
46
|
+
}
|
|
47
|
+
return sprite;
|
|
48
|
+
}
|
|
49
|
+
// [성능 최적화] 스프라이트를 풀로 반환
|
|
50
|
+
#releaseSprite(sprite) {
|
|
51
|
+
sprite.visible = false;
|
|
52
|
+
this._pixiContainer.removeChild(sprite);
|
|
53
|
+
this.#spritePool.push(sprite);
|
|
54
|
+
}
|
|
17
55
|
#updateText() {
|
|
56
|
+
// [성능 최적화] 기존 스프라이트를 풀로 반환 (destroy 대신)
|
|
18
57
|
for (const sprite of this.#sprites) {
|
|
19
|
-
sprite
|
|
58
|
+
this.#releaseSprite(sprite);
|
|
20
59
|
}
|
|
21
60
|
this.#sprites = [];
|
|
22
61
|
if (!this.#font || !this.#text)
|
|
@@ -34,9 +73,12 @@ export class BitmapTextNode extends GameObject {
|
|
|
34
73
|
const c = this.#font.chars[charCode];
|
|
35
74
|
if (!c)
|
|
36
75
|
continue;
|
|
37
|
-
|
|
38
|
-
const texture =
|
|
39
|
-
|
|
76
|
+
// [성능 최적화] 캐시된 텍스처 사용
|
|
77
|
+
const texture = this.#getGlyphTexture(charCode);
|
|
78
|
+
if (!texture)
|
|
79
|
+
continue;
|
|
80
|
+
// [성능 최적화] 풀에서 스프라이트 재사용
|
|
81
|
+
const sprite = this.#acquireSprite(texture);
|
|
40
82
|
const x0 = xPos + c.xoffset;
|
|
41
83
|
const y0 = yPos + c.yoffset;
|
|
42
84
|
sprite.x = x0;
|
|
@@ -78,6 +120,8 @@ export class BitmapTextNode extends GameObject {
|
|
|
78
120
|
console.info(`Bitmap font not preloaded. Loading now: ${this.#fnt}`);
|
|
79
121
|
this.#font = await bitmapFontLoader.load(this.#fnt, this.#src);
|
|
80
122
|
}
|
|
123
|
+
// 폰트가 바뀌면 글리프 캐시 초기화
|
|
124
|
+
this.#glyphTextureCache.clear();
|
|
81
125
|
this.#updateText();
|
|
82
126
|
}
|
|
83
127
|
changeFont(fnt, src) {
|
|
@@ -89,6 +133,9 @@ export class BitmapTextNode extends GameObject {
|
|
|
89
133
|
}
|
|
90
134
|
}
|
|
91
135
|
set text(text) {
|
|
136
|
+
// [성능 최적화] 동일 텍스트면 스킵
|
|
137
|
+
if (this.#text === text)
|
|
138
|
+
return;
|
|
92
139
|
this.#text = text;
|
|
93
140
|
this.#updateText();
|
|
94
141
|
}
|
|
@@ -96,6 +143,16 @@ export class BitmapTextNode extends GameObject {
|
|
|
96
143
|
return this.#text;
|
|
97
144
|
}
|
|
98
145
|
remove() {
|
|
146
|
+
// 풀에 있는 스프라이트도 정리
|
|
147
|
+
for (const sprite of this.#spritePool) {
|
|
148
|
+
sprite.destroy();
|
|
149
|
+
}
|
|
150
|
+
this.#spritePool.length = 0;
|
|
151
|
+
// 글리프 텍스처 캐시 정리
|
|
152
|
+
for (const texture of this.#glyphTextureCache.values()) {
|
|
153
|
+
texture.destroy();
|
|
154
|
+
}
|
|
155
|
+
this.#glyphTextureCache.clear();
|
|
99
156
|
bitmapFontLoader.release(this.#fnt);
|
|
100
157
|
super.remove();
|
|
101
158
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bitmap-text.js","sourceRoot":"","sources":["../../../src/node/ext/bitmap-text.ts"],"names":[],"mappings":"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","sourcesContent":["import { EventMap } from '@webtaku/event-emitter'\nimport { Rectangle as PixiRectangle, Sprite as PixiSprite, Texture as PixiTexture } from 'pixi.js'\nimport { bitmapFontLoader } from '../../asset/loaders/bitmap-font'\nimport { BitmapFont } from '../../types/bitmap-font'\nimport { GameObject, GameObjectOptions } from '../core/game-object'\n\nexport type BitmapTextNodeOptions = {\n fnt: string\n src: string\n text?: string\n} & GameObjectOptions\n\nexport class BitmapTextNode<E extends EventMap = {}> extends GameObject<E> {\n #fnt: string\n #src: string\n #text?: string\n\n #font?: BitmapFont\n #sprites: PixiSprite[] = []\n\n constructor(options: BitmapTextNodeOptions) {\n super(options)\n this.#fnt = options.fnt\n this.#src = options.src\n this.#text = options.text\n this.#load()\n }\n\n #updateText() {\n for (const sprite of this.#sprites) {\n sprite.destroy()\n }\n this.#sprites = []\n\n if (!this.#font || !this.#text) return\n\n let xPos = 0, yPos = 0\n let minX = Infinity, minY = Infinity\n let maxX = -Infinity, maxY = -Infinity\n\n for (let i = 0; i < this.#text.length; i++) {\n const charCode = this.#text.charCodeAt(i)\n\n if (charCode === 10) {\n xPos = 0\n yPos += this.#font.lineHeight\n continue\n }\n\n const c = this.#font.chars[charCode]\n if (!c) continue\n\n const frame = new PixiRectangle(c.x, c.y, c.width, c.height)\n const texture = new PixiTexture({ source: this.#font.texture.source, frame })\n const sprite = new PixiSprite({ texture, zIndex: -999999 })\n\n const x0 = xPos + c.xoffset\n const y0 = yPos + c.yoffset\n\n sprite.x = x0\n sprite.y = y0\n\n this.#sprites.push(sprite)\n\n const x1 = x0 + c.width\n const y1 = y0 + c.height\n\n if (x0 < minX) minX = x0\n if (y0 < minY) minY = y0\n if (x1 > maxX) maxX = x1\n if (y1 > maxY) maxY = y1\n\n xPos += c.xadvance\n }\n\n if (minX === Infinity) {\n minX = 0\n minY = 0\n }\n\n if (maxX === -Infinity) {\n maxX = 0\n maxY = 0\n }\n\n const cx = (minX + maxX) / 2\n const cy = (minY + maxY) / 2\n\n for (const s of this.#sprites) {\n s.x -= cx\n s.y -= cy\n this._pixiContainer.addChild(s)\n }\n }\n\n async #load() {\n if (bitmapFontLoader.checkCached(this.#fnt)) {\n this.#font = bitmapFontLoader.getCached(this.#fnt)\n } else {\n console.info(`Bitmap font not preloaded. Loading now: ${this.#fnt}`)\n this.#font = await bitmapFontLoader.load(this.#fnt, this.#src)\n }\n\n this.#updateText()\n }\n\n changeFont(fnt: string, src: string) {\n if (this.#fnt !== fnt || this.#src !== src) {\n bitmapFontLoader.release(this.#fnt)\n this.#fnt = fnt\n this.#src = src\n this.#load()\n }\n }\n\n set text(text: string | undefined) {\n this.#text = text\n this.#updateText()\n }\n\n get text() {\n return this.#text\n }\n\n override remove() {\n bitmapFontLoader.release(this.#fnt)\n super.remove()\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"bitmap-text.js","sourceRoot":"","sources":["../../../src/node/ext/bitmap-text.ts"],"names":[],"mappings":"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","sourcesContent":["import { EventMap } from '@webtaku/event-emitter'\nimport { Rectangle as PixiRectangle, Sprite as PixiSprite, Texture as PixiTexture } from 'pixi.js'\nimport { bitmapFontLoader } from '../../asset/loaders/bitmap-font'\nimport { BitmapFont } from '../../types/bitmap-font'\nimport { GameObject, GameObjectOptions } from '../core/game-object'\n\nexport type BitmapTextNodeOptions = {\n fnt: string\n src: string\n text?: string\n} & GameObjectOptions\n\nexport class BitmapTextNode<E extends EventMap = {}> extends GameObject<E> {\n #fnt: string\n #src: string\n #text?: string\n\n #font?: BitmapFont\n #sprites: PixiSprite[] = []\n\n // [성능 최적화] 글리프 텍스처 캐시 - charCode → PixiTexture 매핑\n // 동일 폰트에서 같은 문자에 대해 텍스처를 재생성하지 않음\n #glyphTextureCache = new Map<number, PixiTexture>()\n\n // [성능 최적화] 스프라이트 풀 - 재사용으로 GC 부담 감소\n #spritePool: PixiSprite[] = []\n\n constructor(options: BitmapTextNodeOptions) {\n super(options)\n this.#fnt = options.fnt\n this.#src = options.src\n this.#text = options.text\n this.#load()\n }\n\n // [성능 최적화] 글리프 텍스처 가져오기 (캐시 활용)\n #getGlyphTexture(charCode: number): PixiTexture | undefined {\n if (!this.#font) return undefined\n\n let texture = this.#glyphTextureCache.get(charCode)\n if (texture) return texture\n\n const c = this.#font.chars[charCode]\n if (!c) return undefined\n\n const frame = new PixiRectangle(c.x, c.y, c.width, c.height)\n texture = new PixiTexture({ source: this.#font.texture.source, frame })\n this.#glyphTextureCache.set(charCode, texture)\n\n return texture\n }\n\n // [성능 최적화] 풀에서 스프라이트 가져오거나 새로 생성\n #acquireSprite(texture: PixiTexture): PixiSprite {\n let sprite = this.#spritePool.pop()\n\n if (sprite) {\n sprite.texture = texture\n sprite.visible = true\n } else {\n sprite = new PixiSprite({ texture, zIndex: -999999 })\n }\n\n return sprite\n }\n\n // [성능 최적화] 스프라이트를 풀로 반환\n #releaseSprite(sprite: PixiSprite) {\n sprite.visible = false\n this._pixiContainer.removeChild(sprite)\n this.#spritePool.push(sprite)\n }\n\n #updateText() {\n // [성능 최적화] 기존 스프라이트를 풀로 반환 (destroy 대신)\n for (const sprite of this.#sprites) {\n this.#releaseSprite(sprite)\n }\n this.#sprites = []\n\n if (!this.#font || !this.#text) return\n\n let xPos = 0, yPos = 0\n let minX = Infinity, minY = Infinity\n let maxX = -Infinity, maxY = -Infinity\n\n for (let i = 0; i < this.#text.length; i++) {\n const charCode = this.#text.charCodeAt(i)\n\n if (charCode === 10) {\n xPos = 0\n yPos += this.#font.lineHeight\n continue\n }\n\n const c = this.#font.chars[charCode]\n if (!c) continue\n\n // [성능 최적화] 캐시된 텍스처 사용\n const texture = this.#getGlyphTexture(charCode)\n if (!texture) continue\n\n // [성능 최적화] 풀에서 스프라이트 재사용\n const sprite = this.#acquireSprite(texture)\n\n const x0 = xPos + c.xoffset\n const y0 = yPos + c.yoffset\n\n sprite.x = x0\n sprite.y = y0\n\n this.#sprites.push(sprite)\n\n const x1 = x0 + c.width\n const y1 = y0 + c.height\n\n if (x0 < minX) minX = x0\n if (y0 < minY) minY = y0\n if (x1 > maxX) maxX = x1\n if (y1 > maxY) maxY = y1\n\n xPos += c.xadvance\n }\n\n if (minX === Infinity) {\n minX = 0\n minY = 0\n }\n\n if (maxX === -Infinity) {\n maxX = 0\n maxY = 0\n }\n\n const cx = (minX + maxX) / 2\n const cy = (minY + maxY) / 2\n\n for (const s of this.#sprites) {\n s.x -= cx\n s.y -= cy\n this._pixiContainer.addChild(s)\n }\n }\n\n async #load() {\n if (bitmapFontLoader.checkCached(this.#fnt)) {\n this.#font = bitmapFontLoader.getCached(this.#fnt)\n } else {\n console.info(`Bitmap font not preloaded. Loading now: ${this.#fnt}`)\n this.#font = await bitmapFontLoader.load(this.#fnt, this.#src)\n }\n\n // 폰트가 바뀌면 글리프 캐시 초기화\n this.#glyphTextureCache.clear()\n\n this.#updateText()\n }\n\n changeFont(fnt: string, src: string) {\n if (this.#fnt !== fnt || this.#src !== src) {\n bitmapFontLoader.release(this.#fnt)\n this.#fnt = fnt\n this.#src = src\n this.#load()\n }\n }\n\n set text(text: string | undefined) {\n // [성능 최적화] 동일 텍스트면 스킵\n if (this.#text === text) return\n this.#text = text\n this.#updateText()\n }\n\n get text() {\n return this.#text\n }\n\n override remove() {\n // 풀에 있는 스프라이트도 정리\n for (const sprite of this.#spritePool) {\n sprite.destroy()\n }\n this.#spritePool.length = 0\n\n // 글리프 텍스처 캐시 정리\n for (const texture of this.#glyphTextureCache.values()) {\n texture.destroy()\n }\n this.#glyphTextureCache.clear()\n\n bitmapFontLoader.release(this.#fnt)\n super.remove()\n }\n}\n"]}
|
package/lib/node/ext/circle.js
CHANGED
|
@@ -5,7 +5,8 @@ export class CircleNode extends TransformableNode {
|
|
|
5
5
|
#fill;
|
|
6
6
|
#stroke;
|
|
7
7
|
constructor(options) {
|
|
8
|
-
|
|
8
|
+
// [성능 최적화] Graphics는 자식 노드를 가지지 않으므로 sortableChildren 불필요
|
|
9
|
+
super(new Graphics(), options);
|
|
9
10
|
this.#radius = options.radius;
|
|
10
11
|
this.#fill = options.fill;
|
|
11
12
|
this.#stroke = options.stroke;
|