Résumé

  • Le premier projet public du W3C du 14 septembre 2017 décrivait la notification asynchrone du passage d’un élément cible à un seuil d’intersection avec un conteneur ou la fenêtre visible.
  • L’interface offrait aux longues pages un moyen de différer images et contenu sans interroger la mise en page à chaque défilement. La décision de charger ou d’afficher reste celle de l’application.

Le gardien de la galerie a parcouru le couloir vingt fois. La salle suivante est toujours vide. À la vingt et unième ronde, sa collègue lui montre la sonnette à l’entrée. Ce dispositif peu spectaculaire résout un problème que les pages web connaissaient bien : pour savoir si une image lointaine approchait de la fenêtre visible, un script pouvait multiplier les mesures de position pendant que le lecteur faisait défiler la page.

L’avant-projet public du W3C daté du 14 septembre 2017 expose le coût de cette habitude. Les requêtes explicites sur la position d’un élément pouvaient provoquer des recalculs de style et de disposition. Des traitements répétés dans les gestionnaires de défilement pouvaient rendre le mouvement saccadé. Le texte cite les chargements différés, les longues listes qui n’affichent qu’une partie de leurs éléments et la position des objets à l’écran. Sa proposition n’était pas une courbe de gains garantie : elle changeait la manière de poser la question.

Le vocabulaire de l’API est simple. La cible est l’élément surveillé. La racine est la zone de comparaison, soit un élément conteneur, soit la fenêtre visible du contexte supérieur lorsqu’aucune racine n’est indiquée. Un IntersectionObserver reçoit une fonction de rappel et des options. observe(target) commence la surveillance ; unobserve(target) l’arrête pour une cible ; disconnect() arrête l’ensemble. La fonction reçoit des entrées lorsque la relation géométrique passe un seuil défini. Le gardien n’a plus besoin de battre le couloir à heure fixe.

On peut avancer le seuil de la porte. rootMargin agrandit ou réduit le rectangle de référence. Pour préparer une photographie avant son apparition, le site peut déclencher l’avis alors qu’elle est encore un peu plus bas. Les valeurs de threshold règlent la part d’intersection à partir de laquelle l’avis arrive. L’entrée contient notamment les rectangles de la cible et de l’intersection, un rapport, une heure et l’élément concerné. Une galerie et un catalogue peuvent employer la même sonnette sans ouvrir leurs salles au même instant.

Le navigateur fournit l’observation ; l’application choisit l’action. La fonction de rappel peut lancer le chargement d’une image, faire apparaître une carte, créer quelques lignes supplémentaires dans une liste ou rester silencieuse. Le projet soulignait l’utilité de unobserve() pour le chargement différé : une fois l’élément arrivé et traité, on cesse de le suivre. Garder une alerte active pour une photographie déjà accrochée ne rend pas la galerie plus attentive.

Le caractère asynchrone était une décision de conception. Selon le projet de 2017, ces usages n’imposaient pas un délai strict à la milliseconde ; recevoir une information un peu plus tard pouvait être préférable à des lectures synchrones incessantes de la mise en page. Le texte excluait aussi la connaissance parfaite des pixels finalement affichés après tous les filtres et calculs de composition. L’API parle de géométrie selon des règles précises. Elle ignore si le visiteur a admiré le tableau ou s’il cherchait simplement les toilettes.

Le projet W3C actuellement publié conserve l’essentiel : des cibles observées relativement à une racine, des changements transmis à une fonction de rappel et des seuils. L’historique officiel de publication remonte au premier projet de septembre 2017 et énumère des Working Drafts jusqu’en octobre 2023. Ces dates décrivent des documents, pas le calendrier d’adoption des navigateurs. Le texte de 2023 reste lui-même un Working Draft dans cette liste.

Sur une longue page, l’économie vient aussi de la multiplicité. Un catalogue peut confier plusieurs cartes au même observateur et ne préparer que celles qui s’approchent. Un reportage photo peut charger l’image suivante avant son entrée. Une liste peut arrêter la surveillance d’un élément après le premier déclenchement. Le mécanisme commun évite à chaque site de réinventer sa propre ronde de mesures ; les choix éditoriaux et la facture réseau restent les siens.

Il serait tentant de baptiser cette information « attention du public ». Une intersection signifie qu’un rectangle rencontre un autre rectangle suivant la méthode du standard. Le rapport d’intersection décrit cette géométrie. Il ne compte ni regards, ni compréhension, ni plaisir. La sonnette du musée annonce une entrée dans la salle, pas une émotion devant la toile. Cette modestie rend le signal plus utile : on sait exactement quelle question il aide à traiter.

Intersection Observer raconte ainsi une petite réforme du travail du navigateur. Au lieu d’interroger sans cesse la position d’une image lointaine, la page inscrit un seuil et attend l’avis. Le gardien peut enfin rester dans sa salle. Quand la prochaine œuvre approche, la sonnette fait son métier.