HTML網頁製作教學 謹慎使用iframe標記_HTML/Xhtml_網頁製作

使用 iframe 可以輕易的呼叫其他網站的頁面，但應謹慎使用。它比創造其他 DOM 元素（包括 style 和 script）多耗費數十甚至數百倍的性能。增加100個不同元素的時間對比顯示 iframe 是多麼耗費性能：

 

使用 iframe 的頁面通常沒有這麼多 iframe，所以創建 DOM 的時間不用多慮。更值得關心的是 onload 事件和連線池。

iframe 阻塞 onload

window 的 onload 事件盡快執行非常重要。這會讓瀏覽器的載入進度指示器完成，使用者依據此判斷頁面是否已經載入完。而 onload 事件延遲，會讓使用者感覺頁面變慢。

window 的 onload 事件直到它所包含的所有 iframe，以及所有 iframe 中的資源完全載入完成後才會觸發。在 Safari 和 Chrome 中，用 javascritpt 動態的給 iframe 的 src 賦值可以避免這種阻塞行為。

一個連接池

對每個 w​​eb 伺服器來說，瀏覽器只開啟極少的幾個連線數。舊的瀏覽器，包括 IE 6/7 和 Firefox 2，每個主機只有2個連線。在新的瀏覽器中，連線數增加鳥。 Safari 3 和 Opera 9 增至4個，Chrome 1 、IE 8 及 Firefox 3 增至6個。

人們可能會期望每個 iframe 都有單獨的連接池，但並非如此。在大多數瀏覽器中，連線被主頁和它的 iframe 所共享，這意味著有可能 iframe 中的資源佔用了可用連線而阻塞了主頁面的資源載入。如果 iframe 中的內容同等重要，或比主頁更重要，那就很好。然而在通常情況下 iframe 中的內容對頁面來說不太重要，iframe 佔用連線數是不可取的。一個解決方案是在優先順序較高的資源下載完成後再動態的給 iframe 的 src 賦值。

美國的10大網站中有5個使用了 iframe。它們多數用來載入廣告。這不是很合適，但可以理解，這是一個簡單的在內容中插入廣告的途徑。在很多情況下，使用 iframe 是合理的。但要意識到這對你的頁面的效能影響。非必要時，請謹慎使用。