Résumé: L'API Extensions a été mise à jour pour prendre en charge le cache amélioré, le préchargement des navigations. Pour en savoir plus, reportez-vous aux informations ci-dessous.
Chrome met tout en œuvre pour accélérer la navigation. Navigation instantanée telles que le cache amélioré (expédié sur ordinateur dans Chrome 96) et les règles de spéculation (disponible dans Chrome 103) pour améliorer à la fois les changements et les changements à venir expérience. Dans cet article, nous allons passer en revue les modifications apportées au navigateur. des API d'extension pour s'adapter à ces nouveaux workflows.
Comprendre les types de pages
Avant l'introduction du cache amélioré et du prérendu, une personne ne comportait qu'une seule page active. C'était toujours celui qui était visible. Si un l'utilisateur revient à la page précédente, la page active est détruite (Page B). et la page précédente de l'historique serait entièrement reconstituée (Page A). Les extensions n'avaient pas à se soucier de la partie du cycle de vie car il n'y en avait qu'un pour un onglet, l'état actif/visible.
<ph type="x-smartling-placeholder">Avec le cache amélioré et le prérendu, il n'y a plus besoin entre les onglets et les pages. Chaque onglet stocke en fait plusieurs les pages et les pages peuvent passer d'un état à un autre au lieu d'être détruites reconstitué.
Par exemple, une page peut commencer sa vie en tant que page prérendue (non visible), passer à une page active (visible) lorsque l'utilisateur clique sur un lien, puis être stocké dans le cache amélioré (non visible) lorsque l'utilisateur accède à une autre page, sans qu'elle ne soit détruite. Plus loin dans cet article nous allons examiner les nouvelles propriétés présentées pour aider les extensions à comprendre les pages d'état.
<ph type="x-smartling-placeholder">Notez qu'un onglet peut contenir une série de pages prérendues (pas une seule), une seule active (visible) et une série de pages mises en cache précédentes et suivantes.
Qu'est-ce qui change pour les développeurs d'extensions ?
Identifiant frame == 0
Dans Chromium, le cadre supérieur/principal est le cadre le plus externe.
Auteurs d'extensions qui supposent le frameId
du frame le plus externe est 0 (une bonne pratique précédente) peut poser des problèmes.
Un onglet peut désormais comporter plusieurs cadres de plus haut niveau (prérendu et mis en cache)
pages), l'hypothèse qu'il existe une seule couche
le cadre d'un onglet est incorrect. frameId == 0
continuera de représenter
le cadre le plus externe de la page active, mais les cadres les plus externes de
autres pages du même onglet sont différentes de zéro. Un nouveau champ frameType contient
ont été ajoutées pour résoudre ce problème. Consultez la section Comment déterminer si une image est la plus externe ?
de ce post.
Cycle de vie des cadres par rapport aux documents
Un autre concept problématique avec les extensions est le cycle de vie cadre. Un cadre héberge un document (associé à une URL validée). Le document peut changer (en naviguant, par exemple), mais pas frameId. Il qu'un événement s'est produit dans un document spécifique frameIds uniquement. Nous ajoutons le concept de documentId. qui est un identifiant unique pour chaque document. Si l'on parcourt un cadre et ouvre un nouveau document dont l'identifiant sera modifié. Ce champ est utile pour déterminer à quel moment les pages changent d'état de cycle de vie (entre prérendu/actif/en cache), car il reste le même.
Événements de navigation sur le Web
Événements dans l'espace de noms chrome.webNavigation
peut être déclenchée plusieurs fois
sur la même longueur d’onde en fonction
du cycle de vie dans lequel elle se trouve. Voir
"Comment savoir dans quel cycle de vie se trouve la page ?"
et Comment déterminer à quel moment une page effectue une transition ?.
Comment savoir dans quel cycle de vie se trouve la page ?
DocumentLifecycle
a été ajouté à plusieurs API d'extensions, où frameId
était
déjà disponibles. Si le type DocumentLifecycle
est présent dans un événement
(par exemple, onCommitted
).
sa valeur est l'état dans lequel l'événement a été généré. Vous pouvez toujours interroger
informations issues de l'WebNavigation
getFrame()
et getAllFrames()
, mais il est toujours préférable d'utiliser la valeur de l'événement. Si vous utilisez
les deux méthodes, sachez que l'état de l'image peut changer entre le moment où l'événement
a été généré et quand les promesses renvoyées par les deux méthodes sont résolues.
DocumentLifecycle
présente les valeurs suivantes:
"prerender
pouces : la vidéo n'est pas actuellement présentée à l'utilisateur, mais est sur le point d'être présentée à l'utilisateur."active"
: présentation présentée à l'utilisateur."cached"
: stocké dans le cache amélioré."pending_deletion"
: le document est en cours de destruction.
Comment déterminer si une image est la plus externe ?
Auparavant, les extensions avaient peut-être vérifié si frameId == 0
pour déterminer
si l'événement qui se produit concerne le frame le plus externe ou non. Avec plusieurs pages
Dans un onglet, nous avons maintenant plusieurs frames les plus externes. La définition de frameId
est problématique. Vous ne recevrez jamais d'événements concernant une mise en cache
cadre. Toutefois, pour les frames prérendus, frameId
sera
non nulle pour la trame de plus haut niveau. L'utilisation de frameId == 0
comme signal
déterminer s’il s’agit de la trame
la plus externe est incorrecte.
Pour vous aider, nous avons lancé
un nouveau type appelé
FrameType
Il est donc facile de déterminer si le cadre est effectivement
le cadre le plus externe.
FrameType
a les valeurs suivantes:
"outermost_frame"
: généralement appelé cadre supérieur. Notez que il existe des multiples de ces valeurs. Par exemple, si vous disposez d'un modèle prérendu et mis en cache pages, chacune comporte un cadre externe qui pourrait être désigné par le terme "cadre supérieur"."fenced_frame"
: réservé pour une utilisation ultérieure."sub_frame"
: il s'agit généralement d'un iFrame.
Nous pouvons combiner DocumentLifecycle
avec FrameType
et déterminer si une image est
cadre le plus
externe actif. Par exemple, tab.documentLifecycle === “active” && frameType === “outermost_frame”
.
Comment résoudre les problèmes liés au temps d'utilisation avec les frames ?
Comme nous l'avons dit au-dessus, un cadre héberge un document et le cadre peut naviguer vers un nouveau
document, mais frameId
ne changera pas. Cela crée des problèmes
lorsque vous
reçoivent un événement avec seulement frameId
. Si vous recherchez l'URL
de l'image, il peut être différent du moment où l'événement s'est produit. C'est ce qu'on appelle
un problème lié à l'heure d'utilisation.
Pour résoudre ce problème, nous avons lancé documentId
(et parentDocumentId
).
La méthode webNavigation.getFrame()
rend désormais frameId
facultatif si un documentId
est fourni. La
documentId
change à chaque navigation dans un cadre.
Comment déterminer à quel moment une page passe à la suivante ?
Des signaux explicites permettent de déterminer à quel moment une page passe d'un état à un autre.
Examinons les événements WebNavigation
.
Pour la toute première navigation d'une page, vous verrez quatre événements dans l'ordre
comme indiqué ci-dessous. Notez que ces quatre événements peuvent se produire lorsque
L'état de DocumentLifecycle
est "prerender"
ou "active"
.
onBeforeNavigate
onCommitted
onDOMContentLoaded
onCompleted
Ceci est illustré dans le schéma ci-dessous, qui montre que documentId
change
sur "xyz"
lorsque la page prérendue devient la page active.
Lorsqu'une page passe du cache amélioré ou du prérendu au
actif, il y aura trois autres événements (mais avec DocumentLifecyle
"active"
).
onBeforeNavigate
onCommitted
onCompleted
Le documentId
restera le même que dans les événements d'origine. C'est
comme illustré ci-dessus lorsque documentId
== xyz s'active. Notez que
les mêmes événements de navigation se déclenchent, sauf pour onDOMContentLoaded
car la page a déjà été chargée.
Si vous avez des commentaires ou des questions, n'hésitez pas à les poser sur le chromium-extensions groupe.