我在 chrome 中注意到，如果我将图像加载为 base64 字符串，然后滚动浏览页面的该部分，它会变慢。
我还注意到，当我从一个包含我的 Javascript 的选项卡中导航出来然后回到该选项卡时，它会慢几秒钟，就好像 V8 正在重新编译 js 一样。
我能想到三个选项，但我不知道哪个最好：
让你的 js 尽可能快速和雄辩地加载的最佳方法是什么？
通常，在 HTTP 中加载更多文件会比将它们合并到更少文件中产生更多开销。有多种方法可以为各种内容组合文件：
有太多的可能性可以得到任何有保证的解决方案，但是你去：
1）在顶部加载CSS——如果你正在做一个有多个页面的网站，把它全部加载到那里。如果您正在构建一个单页应用程序（您在同一页面上运行画廊和 twitter 提要和文章等，并且您可以打开和关闭不同的部分），那么您可以考虑加载特定于小部件的 CSS，在您加载小部件的时间（如果在启动时不需要它）。
不要在你的 CSS 中使用@import，如果你想让它快速加载（你这样做）。
2）在页面底部加载绝大多数JS。
在 DOM 准备好之后，几乎没有什么不能延迟加载，或者至少不能在页面底部初始化，如果真的有，则将它们作为单独的文件提供在顶部页面，并考虑如何重写以减少对它们的依赖。
3) 小心使用计时器——尤其是 setInterval... ...如果计时器管理不善，您的页面性能可能会遇到很多麻烦。
4) 对窗口滚动、调整大小、鼠标移动或按键等事件处理程序要更加小心。这些东西每秒触发很多很多次，因此如果您编写了依赖它们的精美程序，您需要重新考虑如何触发程序（即：不要在每次处理程序发生故障时都运行它）。
5) 提供 JS 文件是一种权衡：编译 JS 需要一段时间。因此，如果您在一个文件中加载 40,000 行，您的浏览器将暂停一段时间，因为它会编译所有这些。
如果您提供 18 个单独的文件，那么您必须进行 18 个不同的服务器调用。
那也不酷。
因此，一个很好的平衡是将您知道该页面需要的文件连接在一起，然后延迟加载页面上可选的任何内容（例如用于添加评论的小部件或灯箱小部件等） .
并且要么在所有主要产品启动并运行后延迟加载它们，要么在可能的最后一秒加载它们（比如当用户点击“添加评论”按钮时）。
如果您需要在您的应用程序中加载 40,000 行，那么在它启动时，请接受打击，或者决定您可以按什么顺序加载每一行，并提供“加载”指示器（您应该在延迟加载时这样做）总是）每个小部件，直到它准备好（一次加载一个 JS）。
这些是解决一般性能问题的指南。
即使您将网站直接放在您面前，也很难回答具体问题。使用 Chrome 开发控制台来分析信息和网络性能，以及渲染性能等。
嗯，有一个非常流行的概念叫做串联。这个想法是尽可能少地向您的服务器发出 HTTP 请求。因为每个请求都意味着一个新的连接，为此会发生 DNS 查找，然后协商握手，然后在更多基于协议的步骤之后，服务器将请求的文件作为响应发送。
您可以查看http-archive以获取性能最佳实践列表。
所以是的，你应该将所有 JS 文件合并为一个（有某些例外，比如 js 在头部和 js 在页脚）
这是您的问题标题和第 2 点和第 3 点的答案。
至于另一部分，我不清楚你所说的场景。
我最近遇到了同样的问题，然后我开发并发布了一个 JS 库（MIT 许可证）来做到这一点。基本上，您可以将所有内容（js、图像、css ...）放入标准 tar 存档（您可以在服务器端创建），然后库读取它并允许您轻松使用文件。
你会在这里找到它：https ://github.com/sebcap26/FileLoader.js
它适用于所有最近浏览器和 IE >= 10。
要加载的文件数量会影响整个站点的加载速度。我建议将网站正确显示所需的所有功能打包到一个 javascript 文件中。