推广方法智搜宝:浏览器可以并行执行多个请求,无法与脚本文件的操作并行执行!

预加载器(Pre-loader)可以说是提高浏览器性能最重要的举措。Mozilla 官方发布数据，通过预加载器技术网页的加载性能提升了19%，Chrome测试了 Alexa 排名前2000名网站，性能有20%的提升。 它并不是一门新技术，有人认为只有 Chrome 才具备这个功能。也有人认为它是有史以来提升浏览器性能最有效的方法。如果你第一次接触预加载器，也许心中已经有了无数个问号。什么是预加载器？它是如何提升浏览器性能的？ 首先需要了

　　预载入器(Pre-loader)能够说成提升电脑浏览器特性最关键的措施。Mozilla 官方网公布信息，根据预载入器技术性网页页面的载入性能增加了19%，Chrome检测了 Alexa 排行前2000名网址，特性有20%的提高。

　　它并非一门新技术应用，许多人觉得只能 Chrome 才具有这一作用。也许多人觉得这是迄今为止提高电脑浏览器特性最最好的办法。当你第一次接触预载入器，或许心里早已拥有无数疑问。什么叫预载入器？这是怎样提高电脑浏览器特性的？

　　最先必须掌握电脑浏览器是怎样载入网页页面的

　　一个网页页面的载入取决于脚本制作文档、CSS款式文档。我们一起看一下电脑浏览器载入网页页面的全过程。

　　最先，浏览器下载 HTML 并刚开始分析。假如电脑浏览器发觉外界CSS资源链接则推送免费下载恳求。 电脑浏览器能够在免费下载CSS資源的另外，并行处理分析HTML文档，可是，一旦发觉有脚本制作文档的引证，则务必等候脚本制作文档进行免费下载而且实行后才可以再次分析。 脚本制作文档进行免费下载而且实行后，电脑浏览器能够再次分析HTML工作中，假如碰到非堵塞資源 i.e. 图片浏览器会推送免费下载恳求而且再次分析。

　　即便电脑浏览器能够并行执行好几个恳求，可是没法与对于脚本制作文档的实际操作并行执行。

　　能够根据IE7开启连接中的网页页面开展检测。人们能够看见，网页页面head标识内包括2个款式文档和2个脚本制作文档。在body 中，包括3个照片、1个脚本制作文档。

　　根据流式布局人们能够查询資源载入的全过程：

　　脚本制作文档的免费下载和实行，会阻隔别的資源文档的免费下载，毫无疑问将大幅度降低电脑浏览器特性。

　　预载入器怎样提升互联网使用率

　　2008 年，IE、WebKit和Mozilla都保持了预载入器作用，来提高互联网的使用率，改进脚本制作文档对别的資源文档的堵塞现况。

　　当电脑浏览器被脚本制作文档堵塞时，另一个轻巧的在线解析会再次预览剩下的标识，找寻必须免费下载的資源i.e. 款式文档， 脚本制作文档，照片 等。

　　一旦发觉，预载入器既能够在后台管理刚开始接受这种資源，等候主在线解析进行当今的脚本制作实际操作，别的資源早已进行免费下载，那样就缓解了脚本制作堵塞产生的特性耗损。

　　下边这一流式布局是应用IE8开启连接中网页页面的結果，特性有明显的提高：IE8=7S > IE7=14S。

　　预载入作用依然是各大电脑浏览器生产商忘乎所以的试验行业。许多电脑浏览器试着设定资源下载的优先。比如，Safari减少了不功效于当今主视图地区款式文档的优先。Chrome 则设定脚本制作文档的优先高过照片，即便脚本制作文档坐落于HTML底端。

　　预载入器的圈套

　　预载入器只有查找HTML标识中的URL，没法检验到应用脚本制作编码加上的URL，直到脚本制作代码执行时才能够获得这种資源。

　　曾经的我碰到过一个根据javascript分辨当今Window总宽，从而管理决策载入CSS款式文档的事例。预载入器没法鉴别该类資源。

　　var file = window.innerWidth < 1000 ? “mobile.css” : “desktop.css”;

　　document.write(‘ href=”css/’\#+ file\#+ ‘”/>’);

　　上边这一段编码能够轻轻松松的骗得IE9的预载入体制，在下边的流式布局中人们能够看见，加载图片占有了全部的联接，直到第一个照片载入进行后，CSS文档才开始下载。

　　危害预载入器的载入次序的要素

　　当今，有几类方法来操纵预载入器的载入次序（应用javacript掩藏資源文档即是在其中一种），另外，W3C Resource Priorities 中也出示2个特点来危害预载入器。

　　lazyload : 直到沒有被标识为lazyload 资源下载结束后才免费下载被标识資源。

　　postpone: 資源在对终端用户看得见以后才开始下载。i.e. 标识的display特性被设定为 none。

　　预载入VS预载入

　　预载入（Pre-fetching）能够通告电脑浏览器什么資源将会会在将来的某一机会，在当今网页页面或是别的网页页面中应用。

　　下边是预载入的一个简易的运用，通告电脑浏览器为即将浏览的别的网站载入資源：

　　Chrome容许人们事先通告电脑浏览器载入将来会采用的資源，被申明的資源将以较高的优先被免费下载

　　(Chromium 源代码中提及，被标识为subresource的资源下载的优先小于款式文档和脚本制作文档，但高于照片载入优先)

　　也有标识能够通告电脑浏览器什么文档是较低等其他预载入文档。

　　预载入将来将被应用的单独資源文档。根据预载入方法，在后台管理3D渲染全部网页页面。小结

　　预载入并不是一门新技术应用，它对提升电脑浏览器特性具备留念实际意义，人们不用做一切实际操作既能够应用预载入。

　　它广泛运用，我检测了下列电脑浏览器，都具备预载入作用：

　　IE8 / 9 / 10

　　Firefox

　　Chrome (inc Android)

　　Safari (inc iOS)

　　Android 2.3

　　Bruce Lawson (Opera公司老总)也公布Opera Mini 一样适用预载入。

　

转载请注明: 爱推站 » 推广方法智搜宝:浏览器可以并行执行多个请求,无法与脚本文件的操作并行执行!