我目前正在做一个学生项目，但我的代码遇到了问题。我们构建了一个电子文档，其中混合了夜间工作人员的视频、图像、声音和文本数据。 它由 HTML、Javascript 和一些用于访问数据库的 PHP 组成。
最近我们发现，当您访问该网站时，该页面一直在无限加载...它破坏了我们的一些 JS 代码，我们不知道如何识别可能已损坏的资源...
什么可以使页面“永远”加载？我们应该使用什么样的工具(即 firebugg 或内置的 chrome 工具)来确定问题？
您可以在这里找到我们的开发版本:http://mgprddev2012.dream-valenciennes.com
编辑:PHP 错误现在好了，我忘了在开发平台上上传最新版本的代码。
非常感谢
最佳答案
你没疯——这个页面确实需要非常非常长的时间来加载。
如果您查看 Chrome 开发者工具中的“网络”选项卡，您会看到一开始加载了很多图像、音频文件和视频文件，而且大部分都不会立即显示。其中一些非常大。这可能是其中一种情况，最好推迟加载这些 Assets 中的大部分，直到您需要显示它们，或者至少推迟到您立即加载所需的 Assets 之后。
我建议检查你YSlow ，这是一种审核工具，可为您提供一些提示，帮助您加快网页加载速度并看起来加载速度更快。该网站还提供了一些很好的提示和详尽的解释，说明了为什么不同的策略是有效的。
针对此特定页面的一些提示:
您的很多图片都是文字图片。考虑将这些呈现为实际的 html 文本。您仍然可以使用 CSS 修改每个字母的大小，并且您将获得额外的好处，即 Chrome 能够为非法语用户翻译文本。您应该能够使用 CSS 边框在文本周围添加这些线条，或者尝试使用 SVG。
您的背景图片大小为 2.2 MB。那是相当大的。尝试以较低的压缩设置保存它。
您在单个 png 文件中有一堆图标。考虑将它们全部放在一个文件中并将它们显示为 CSS Sprites .
有几个 png 文件看起来像 jpg，除了透明度。如果你有野心，你可以制作一个 jpg，左边是颜色 channel ，右边是灰度渲染的 alpha channel ，然后用 Canvas 合成它们。
您还有一些包含动画 Sprite 的 png 文件。您可以将它们转换为视频并尝试与上面相同的 Canvas 技巧。如果您愿意使用 WebGL，我有一些代码供您使用。
关于javascript - 网页永远不会停止加载，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/14387518/