如何利用预加载器技术有效加快网页加载过程？

本文共计1749个文字，预计阅读时间需要7分钟。

预加载器（Pre-loader）是提升浏览器性能的关键举措。Mozilla 官方发布数据显示，通过预加载技术，网页的加载性能提升了19%。Chrome 对 Alexa 排名前2000的网站进行了测试，性能提升了20%。

预加载器(Pre-loader)可以说是提高浏览器性能最重要的举措。Mozilla 官方发布数据，通过预加载器技术网页的加载性能提升了19%，Chrome测试了 Alexa 排名前2000名网站，性能有20%的提升。

它并不是一门新技术，有人认为只有 Chrome 才具备这个功能。也有人认为它是有史以来提升浏览器性能最有效的方法。如果你第一次接触预加载器，也许心中已经有了无数个问号。什么是预加载器？它是如何提升浏览器性能的？

首先需要了解浏览器是如何加载网页的

一个网页的加载依赖于脚本文件、CSS样式文件。让我们看看浏览器加载网页的过程。

• 首先，浏览器下载 HTML 并开始解析。如果浏览器发现外部CSS资源链接则发送下载请求。
• 浏览器可以在下载CSS资源的同时，并行解析HTML文件，但是，一旦发现有脚本文件的引用，则必须等待脚本文件完成下载并且执行后才能继续解析。
• 脚本文件完成下载并且执行后，浏览器可以继续解析HTML工作，如果遇到非阻塞资源 i.e. 图片浏览器会发送下载请求并且继续解析。

即使浏览器可以并行执行多个请求，但是无法与针对脚本文件的操作并行执行。

可以通过IE7打开链接中的网页进行测试。我们可以看到，网页head标签内包含2个样式文件和2个脚本文件。在body 中，包含3个图片、1个脚本文件。