javascript - 如何诊断我网站上的性能问题

Question

我创建了一个网站，显示来自 Instagram、Facebook 和 Twitter 的某些帖子。该网站以卡片形式显示这些帖子，并带有某些动画和过渡。它在桌面上运行良好，但目标是在树莓派上运行它，当从其中一个运行时，动画和视频会结结巴巴。我想减少或消除口吃，我正在考虑几种方法：

• 网络工作者将一些动画计算卸载到一个单独的 CPU 核心
• 服务器上的动态视频压缩取决于将播放视频的设备
• 不同的动画方法

为了弄清楚这些是否有帮助，我想首先弄清楚是什么导致了口吃，但我不知道该怎么做。我需要一种方法来确定减速的哪一部分是由于什么问题。比如，加载图像/视频的影响是什么，播放视频的影响，动画元素的影响等等。这样做的最佳方式是什么？

这是该网站的工作版本，如果这将有助于提出建议。请注意，我对 JS 或一般编程的经验并不丰富，而且我在创建它时才刚刚开始，所以它远非最佳，但现在我需要找出改进它的最佳方法。

标签： javascriptreactjsgoogle-chromeraspberry-pi

Answer 1

这可能是性能问题，但也可能是其他问题。如果您使用的是 VNC Viewer 或其他形式的远程桌面，可能就是因为这个原因。但是，如果它只是连接到显示器，则很可能是 CPU 无法处理它。您可以尝试安装更轻量级的浏览器，因为 Chromium 确实会对 CPU 造成影响。转到 Chrome DevTools，然后转到性能选项卡。这应该基本上向您展示您需要知道的一切。我不确定您是否使用 CSS 过渡或其他东西，所以我无法真正帮助您。不过，您可以尝试将 NetSurf 或 Dillo 作为更轻量级的浏览器。