Flutter SVG 与 PNG 性能方式

Question

我必须在 Flutter 移动应用程序中显示很多图像。什么是最好的选择？显示图像时，请使用PNG 或 SVG。我是否可以知道可比差异何时接受我进行了很多搜索，但我没有以这种方式获得大量结果。

PS：我不使用网络图像或任何资源。

Answer 1

通过对这些内容进行更多研究，我发现了以下内容：

• 众所周知，SVG 文件速度较慢，因为库需要读取 XML 文件。实际的绘制过程很好，但由于需要解析 XML 文件，因此可能会导致延迟。解析结果被缓存，因此延迟通常仅发生在渲染形状的第一帧中。
• 如果标记很简单，那么应该编写 CustomPainter 代码来直接绘制形状，而不是从文件中读取，这样会更快。然而，除非实现缓存系统，否则可能不会缓存结果。
• 另一方面，PNG 文件使用以本机代码编写的编解码器，并利用 Skia 绘制 RAW 颜色信息，就像 CustomPaint 一样。PNG 文件也可以缓存此信息，因此连续调用绘制同一文件不需要再次使用编解码器，Skia 可以直接绘制图像。
• CustomPaint 可用于将 PNG 文件绘制到画布上。最终，一切都使用 Skia 渲染到屏幕上，而 Skia 是硬件加速的，因此任何时间损失通常发生在到达 Skia 之前，例如从存储或网络读取图像或通过 Dart 与 Skia 通信时。
• 与编程中的所有事情一样，最好在有疑问时进行测试。除非屏幕上有数百或数千个标记，否则 SVG 和 PNG 文件之间的性能差异不太可能很大。

对于以这种方式看待的人，我认为这会有所帮助。