JavaScript 2D渲染库[pixie.js vs three.js]

Question

很少有JavaScript库允许使用WebGL渲染2D图形。我发现，最受欢迎的是three.js和pixi.js。它们都允许您使用WebGL或canvas渲染器（对于不支持WebGL的设备）。

我想问你在以下术语中哪些库更好：

• 我希望它仅用于2D图形，因此3D支持是完全可选的。
• 表现非常重要 - 很多元素，文字，平滑缩放，翻译等等都是非常重要的。
• 画布渲染器（当设备不支持WebGl时很重要）我希望使用这两个渲染器看到相同（或非常相似）的结果。

如果有另一个图书馆，我应该在这个特殊的情况下得到调整，请随时告诉它：）

Answer 1

我有完全相同的用例，只是试过两个。对于5000个精灵及以上，加载大量静态精灵（来自相同图像）的速度在three.js中更快，但是动画只有少数几个精灵在pixi中提供更好的帧速率（同样，对于5000个精灵）。 （这是在桌面上的Chrome和IE9上测试的）

最大的区别在于Canvas渲染器，其中pixi的自动检测为相同的代码提供与WebGL相同的结果（如果更慢），但是三个.js的Canvas渲染器doesn't support the Sprite type意味着实现您必须的可移植代码使用粒子。如果你不使用那么多的精灵并且大多数都有四边形或三角形，那就不是问题了。

如果教程等的可用性完全是个问题，那么three.js就更成熟了，所以有更多的材料。

否则，对于同时渲染的最多2-3k个元素，我会选择pixi。

Answer 2

与pixi.js一起工作很多，目前与three.js一起工作。

pixi.js基于用于Flash游戏的AS3 API。这意味着该API（结构）已经过测试和尝试超过three.js。 （仅用于2D）

three.js更为流行，在某些情况下可能更为最新。例如，在添加着色器时，它比pixi.js具有更大的灵活性。 pixi.js尚无法添加“原始”着色器，而无需在着色器代码的顶部附加任何内容。对于指定着色器版本“ #version 300 es”（pixi.js默认使用较旧的版本），这一点很重要。