跳到主要内容
版本：v8.x

性能提示

通用​

  • 仅在需要时才优化！PixiJS 就能处理不小的内容
  • 注意场景的复杂性。添加的对象越多，运行速度最终越慢
  • 顺序有所帮助，例如，雪碧/图形/雪碧/图形比雪碧/雪碧/图形/图形慢
  • 某些较旧的移动设备运行速度稍慢。向渲染器或应用程序传入选项 useContextAlpha: false 和 antialias: false 可有助于提高性能
  • 默认情况下，剔除是禁用的，因为这样做通常在应用程序级别，或者将对象设置为 cullable = true。如果受到 GPU 约束，它将提高性能；如果受到 CPU 约束，它将降低性能

雪碧​

  • 尽可能使用雪碧图以最大程度减少总纹理
  • 雪碧可以与最多 16 种不同的纹理进行批处理（取决于硬件）
  • 这是渲染内容的最快方法
  • 在较旧设备上使用较小的低分辨率纹理
  • 将扩展名 @0.5x.png 添加到缩小 50% 的雪碧图，以便 PixiJS 将其自动放大一倍
  • 绘制顺序可能很重要

图形​

  • 当图形对象没有被持续修改时，它们运行速度最快（不包括变换、alpha 或色调！）
  • 当图形对象小于一定尺寸（100 点或更小）时，它们会被批处理
  • 小型图形对象与雪碧（矩形、三角形）一样快
  • 使用 100 个复杂的图形对象可能会很慢，在这种情况下，使用雪碧（可以创建纹理）

纹理​

文本​

  • 避免在每帧中更改此设置，因为这可能会非常耗时（每次将其绘制到画布上，然后上传到 GPU）
  • 位图文本针对动态更改的文本提供了更好的性能
  • 文本分辨率与渲染器分辨率相匹配，通过设置 resolution 属性可以自己降低分辨率，这可能会消耗更少的内存

遮罩​

  • 如果使用过多，遮罩可能会非常耗时：例如，数百个遮罩会让运行速度真的慢下来
  • 与轴对齐的矩形遮罩是最快的（就像使用剪刀矩形一样）
  • 图形遮罩是第二快的（因为它们使用模版缓冲）
  • 精灵遮罩是第三快的（它们使用滤镜）。它们真的非常耗时。请不要在场景中使用太多！

滤镜​

  • 释放内存：container.filters = null
  • 如果您知道其大小：container.filterArea = new Rectangle(x,y,w,h)。这可以加快速度，因为它表示不需要测量对象
  • 滤镜是耗时的，使用过多会开始减慢速度！

混合模式​

  • 不同的混合模式会导致批次中断（优化下降）
  • ScreenSprite / NormalSprite / ScreenSprite / NormalSprite 将有 4 次绘制调用
  • ScreenSprite / ScreenSprite / NormalSprite / NormalSprite 将有 2 次绘制调用

事件​

  • 如果对象没有交互式子级，则使用 interactiveChildren = false。然后，事件系统将能够避免爬取这个对象
  • 如上设置 hitArea = new Rectangle(x,y,w,h) 应阻止事件系统爬取该对象