The iframes provides a simple way to embed the content of a website to another site. But we need to be careful of using the iframe. iframe created scripts and css DOM elements created by 1-2 orders of magnitude slower than the other.

Use iframe page normally does not contain too many iframe, to create a DOM node takes time so they do not account for a large proportion. But it will bring some of the other issues: onload event and connection pooling (connection pool).

The Iframes blocking page load

Timely trigger window onload event is very important. onload event trigger the browser "busy" indicator stops, telling the user that the page has been loaded. When the onload event to load delay, it gives the user the feeling is that this web page is very slow.

window onload event to trigger all iframe loaded (contain elements inside). Safari and Chrome, set dynamically through JavaScript the iframe SRC avoid this blocking situation.

The only connection pool

The browser can only open a small number of connections to the web server. The old browser contains in Internet Explorer 6 & 7 and Firefox 2, only a domain name (hostname) open at the same time two connections. Increase in the number of restrictions in the new version of the browser. Safari 3 + and Opera 9 + for a domain name at the same time to open four connections, Chrome 1 +, IE 8, and Firefox 3 can be open at the same time six.

Some people may want to iframe will have its own separate connection pool, but not like this. The vast majority of browser, the main page and the iframe shared these connections. This means that when the iframe load resources may run out of all available connections, thereby blocking the loading of the main page resource. If the iframe content more than the contents of the home page, which of course is very good. But the content is usually the case, iframe was not the contents of the home page is important. Then iframe ran out of available connections is not worth. One solution is the important element of the main page is loaded, and then dynamically set the iframe SRC.

The top 10 U.S. sites use iframe. In most cases, they use it to load ad. This is understandable, also a logical solution, a simple way to load the ad service. But keep in mind, the iframe will give you the page performance impact. Whenever possible, do not use the iframe. When does require cautious use them.