页面加载时html资产的顺序是什么 [英] what is the order of html assets when page load

问题描述

什么是加载顺序？

1. php


2. html


3. Java脚本


4. css


5. jquery


6. ajax

请给我一些小解释

谢谢，

2）HTML逐渐被解析。当资产请求到达时，浏览器将尝试下载资产。大多数HTTP服务器和大多数浏览器的默认配置是并行处理两个请求。 IE可以重新配置为并行下载无限数量的资产。在互联网上，Steve Souders可以同时下载100多个请求。例外情况是脚本请求在IE中阻止并行资产请求。这就是为什么强烈建议将所有JavaScript放在外部JavaScript文件中，并将请求放在HTML中的关闭body标签之前。

3 b）b）b

3）HTML DOM被渲染时被解析。几乎在所有用户代理中，CSS都呈现为与DOM呈现并行。因此，强烈建议将所有CSS代码放入文档部分请求尽可能高的外部CSS文件中。否则，页面呈现出现在DOM中的CSS请求位置，然后从顶部开始渲染。

4）只有在DOM完全呈现后并且页面中的所有资源的请求都会被解析，或JavaScript在onload事件中执行超时。 IE7，我不确定IE8，如果没有收到资产请求的HTTP响应，不会很快超时。这意味着通过JavaScript内嵌到页面的资源，即写入HTML标签中的JavaScript不包含在函数中，可以阻止onload事件在数小时内执行。如果内联代码存在于页面中，并且由于导致代码崩溃的名称空间冲突而无法执行，则可能会触发此问题。

上面的步骤中，是CPU占用最多的是解析DOM / CSS。如果您希望更快地处理页面，那么可以通过消除重复指令并将CSS指令合并到尽可能少的元素引用中来编写高效的CSS。减少DOM树中节点的数量也会产生更快的渲染效果。请注意，您从HTML或甚至CSS / JavaScript资源请求的每项资产都是请求一个单独的HTTP头。这消耗了带宽并且需要按照请求处理。如果您想尽可能快地加载页面，请减少HTTP请求的数量并减少HTML的大小。你不会仅仅通过HTML来平均180k的页面权重来做你的用户体验。许多开发人员订阅了一些谬误，用户在6纳秒内对网页内容的质量作出了决定，然后从服务器清除DNS查询，并在不满意的情况下烧毁他的计算机，所以他们提供了最美丽的页面250k的HTML。保持您的HTML简短而甜蜜，以便用户可以更快地加载您的页面。没有什么能够改善用户体验，例如快速响应的网页。

〜源代码

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 〜

所以，简而言之：

html会首先加载，因为这会指示浏览器处于扩展状态需求：图片，脚本，外部样式表等等

之后，加载顺序非常随机 - 大多数浏览器都会启动多个连接，并且它们返回的顺序不能被预测。

What is the order of loading?

1. php
2. html
3. java script
4. css
5. jquery
6. ajax

please give me little explanation too

Thanks,

解决方案

1) HTML is downloaded.

2) HTML is parsed progressively. When a request for an asset is reached the browser will attempt to download the asset. A default configuration for most HTTP servers and most browsers is to process only two requests in parallel. IE can be reconfigured to downloaded an unlimited number of assets in parallel. Steve Souders has been able to download over 100 requests in parallel on IE. The exception is that script requests block parallel asset requests in IE. This is why it is highly suggested to put all JavaScript in external JavaScript files and put the request just prior to the closing body tag in the HTML.

3) Once the HTML is parsed the DOM is rendered. CSS is rendered in parallel to the rendering of the DOM in nearly all user agents. As a result it is strongly recommended to put all CSS code into external CSS files that are requested as high as possible in the section of the document. Otherwise the page is rendered up to the occurance of the CSS request position in the DOM and then rendering starts over from the top.

4) Only after the DOM is completely rendered and requests for all assets in the page are either resolved or time out does JavaScript execute from the onload event. IE7, and I am not sure about IE8, does not time out assets quickly if an HTTP response is not received from the asset request. This means an asset requested by JavaScript inline to the page, that is JavaScript written into HTML tags that is not contained in a function, can prevent the execution of the onload event for hours. This problem can be triggered if such inline code exists in the page and fails to execute due to a namespace collision that causes a code crash.

Of the above steps the one that is most CPU intensive is the parsing of the DOM/CSS. If you want your page to be processed faster then write efficient CSS by eliminating redundent instructions and consolidating CSS instructions into the fewest possible element referrences. Reducing the number of nodes in your DOM tree will also produce faster rendering.

Keep in mind that each asset you request from your HTML or even from your CSS/JavaScript assets is requested with a separate HTTP header. This consumes bandwidth and requires processing per request. If you want to make your page load as fast as possible then reduce the number of HTTP requests and reduce the size of your HTML. You are not doing your user experience any favors by averaging page weight at 180k from HTML alone. Many developers subscribe to some fallacy that a user makes up their mind about the quality of content on the page in 6 nanoseconds and then purges the DNS query from his server and burns his computer if displeased, so instead they provide the most beautiful possible page at 250k of HTML. Keep your HTML short and sweet so that a user can load your pages faster. Nothing improves the user experience like a fast and responsive web page.

~source

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

So, in short:

The html will load first obviously as this instructs the browser on the extended requirements: images, scripts, external stylesheets etc

After that, the load order is pretty random - multiple connections will be initiated by most browsers and the order in which they return cannot be predicted.

这篇关于页面加载时html资产的顺序是什么的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！