Paginaovergangen hebben niet het gevoel dat ze op het netwerk blokkeren

Snelle pagina-overgangen zijn van cruciaal belang voor de manier waarop gebruikers de prestaties van uw Progressive Web App (PWA) waarnemen. Overgangen moeten pittig aanvoelen, zelfs op een langzaam netwerk.

Aanbevelingen

Om langzame pagina-overgangen te vinden, navigeert u door uw web-app met behulp van een gesimuleerd langzaam netwerk. Om dat in Chrome te doen:

[commentaar]: <> (De eerste twee lijstitems zijn afkomstig van een shortcode van web.dev, maar deze is voor geen enkele taal uit het Engels vertaald.) 1. Druk op Control + Shift + J (of Command + Option + J op Mac ) om DevTools te openen. 2. Klik op het tabblad Netwerk . 3. Selecteer Langzame 3G in de vervolgkeuzelijst Throttling .

Elke keer dat u op een link of knop in de app tikt, controleert u op een van de volgende twee manieren of de pagina onmiddellijk reageert:

  • De pagina gaat onmiddellijk over naar het volgende scherm en toont een laadscherm terwijl u wacht op inhoud van het netwerk.
  • De pagina toont een laadindicator terwijl de app wacht op een reactie van het netwerk.

Als u werkt aan een door de klant gegenereerde app van één pagina, zet de gebruiker dan onmiddellijk over naar de volgende pagina en toon een skeletscherm . Zorg ervoor dat u onmiddellijk alle inhoud weergeeft die al beschikbaar is, zoals de paginatitel of miniatuur, terwijl de rest van de inhoud wordt geladen.

Bronnen

,

Snelle pagina-overgangen zijn van cruciaal belang voor de manier waarop gebruikers de prestaties van uw Progressive Web App (PWA) waarnemen. Overgangen moeten pittig aanvoelen, zelfs op een langzaam netwerk.

Aanbevelingen

Om langzame pagina-overgangen te vinden, navigeert u door uw web-app met behulp van een gesimuleerd langzaam netwerk. Om dat in Chrome te doen:

[commentaar]: <> (De eerste twee lijstitems zijn afkomstig van een shortcode van web.dev, maar deze is voor geen enkele taal uit het Engels vertaald.) 1. Druk op Control + Shift + J (of Command + Option + J op Mac ) om DevTools te openen. 2. Klik op het tabblad Netwerk . 3. Selecteer Langzame 3G in de vervolgkeuzelijst Throttling .

Elke keer dat u op een link of knop in de app tikt, controleert u op een van de volgende twee manieren of de pagina onmiddellijk reageert:

  • De pagina gaat onmiddellijk over naar het volgende scherm en toont een laadscherm terwijl u wacht op inhoud van het netwerk.
  • De pagina toont een laadindicator terwijl de app wacht op een reactie van het netwerk.

Als u werkt aan een door de klant gegenereerde app van één pagina, zet de gebruiker dan onmiddellijk over naar de volgende pagina en toon een skeletscherm . Zorg ervoor dat u onmiddellijk alle inhoud weergeeft die al beschikbaar is, zoals de paginatitel of miniatuur, terwijl de rest van de inhoud wordt geladen.

Bronnen