Tutoriel de production de pages Web HTML : Utiliser les balises iframe avec la production de pages Caution_HTML/Xhtml_Web

L'utilisation d'iframe peut facilement appeler des pages d'autres sites Web, mais elle doit être utilisée avec prudence. Cela coûte des dizaines, voire des centaines de fois plus de performances que la création d'autres éléments DOM (y compris le style et le script). La comparaison temporelle de l'ajout de 100 éléments différents montre à quel point les iframes sont gourmandes en performances :

Les pages qui utilisent des iframes n'ont généralement pas autant d'iframe, vous n'avez donc pas à vous soucier trop du temps qu'il faut pour créer le DOM. Ce qui mérite davantage de préoccupation, ce sont l'événement onload et le pool de connexions.

blocs iframe lors du chargement

Il est très important que l'événement onload de window soit exécuté le plus tôt possible. Cela complétera l'indicateur de progression de chargement du navigateur, que l'utilisateur utilisera pour déterminer si le chargement de la page est terminé. Le retard de l'événement onload donnera à l'utilisateur l'impression que la page est lente.

L'événement onload de la fenêtre ne sera déclenché que lorsque toutes les iframes qu'elle contient et les ressources de toutes les iframes seront complètement chargées. Dans Safari et Chrome, l'utilisation de javascript pour attribuer dynamiquement une valeur au src de l'iframe peut éviter ce comportement bloquant.

Un pool de connexion

Le navigateur n'ouvre qu'un très petit nombre de connexions à chaque serveur Web. Les navigateurs plus anciens, notamment IE 6/7 et Firefox 2, n'ont que 2 connexions par hôte. Dans les nouveaux navigateurs, le nombre de connexions augmente. Safari 3 et Opera 9 sont passés à 4, et Chrome 1, IE 8 et Firefox 3 sont passés à 6.

On pourrait s'attendre à un pool de connexions distinct pour chaque iframe, mais ce n'est pas le cas. Dans la plupart des navigateurs, la connexion est partagée entre la page principale et son iframe, ce qui signifie qu'il est possible que les ressources de l'iframe occupent les connexions disponibles et bloquent le chargement des ressources de la page principale. C'est très bien si le contenu de l'iframe est tout aussi important, voire plus important, que la page principale. Cependant, dans des circonstances normales, le contenu de l'iframe n'est pas important pour la page et il n'est pas conseillé que l'iframe occupe le nombre de connexions. Une solution consiste à attribuer dynamiquement une valeur au src de l'iframe après le téléchargement de la ressource de priorité supérieure.

5 des 10 meilleurs sites Web aux États-Unis utilisent des iframes. La plupart d’entre eux sont utilisés pour charger des annonces. Ce n'est pas une solution idéale, mais c'est compréhensible et constitue un moyen simple d'insérer des publicités dans votre contenu. Dans de nombreux cas, l’utilisation d’iframes est logique. Mais soyez conscient de l’impact sur les performances de votre page. Veuillez l'utiliser avec prudence, sauf si cela est nécessaire.