Chargement plus rapide de ExtJS

Neil McGuigan

Traducteur

vermine

Le chargement des différents composants d'une page web peut prendre du temps. L'auteur vous explique une manière de tromper l'utilisateur et de lui faire croire à un chargement rapide.
Cet article est la traduction de ExtJS Faster Loading publié sur ExtJS Tutorials.

- Titre : Chargement plus rapide de ExtJS

- Auteur : Neil McGuigan

- Traducteur : vermine

- Parution : 14 août 2012

- Licence : Les sources présentées sur cette page sont libres de droits et vous pouvez les utiliser à votre convenance. Par contre, la page de présentation constitue une œuvre intellectuelle protégée par les droits d'auteur. Copyright ® 2012 Neil McGuigan. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts.

Sommaire

- I. Démarche

- II. Niveau code

- III. Remerciements

I - Démarche

Voici comment faire pour que votre application semble se charger plus rapidement. C'est une technique utilisée dans la programmation iOS.

1. Prendre une capture d'écran de votre application chargée dans son état initial. Supprimer toutes les informations spécifiques à un utilisateur ou en rapport avec la date et l'heure.

2. Rendre floue ou masquer cette image quelque peu.

3. D'abord charger l'image et la mettre en background de la page HTML.

4. Charger ExtJS et votre application.

5. Démarrer votre application.

6. L'application va démarrer et montrer son interface couvrant ainsi le background.

II - Niveau code

Pour s'assurer qu'une image se charge en premier lieu, mettre ce script au début :

new Image()).src = 'chemin de votre image de démarrage';

Pour la positionner en tant que background de la page, ajouter ce style sur votre page :

html {
background-image: url('chemin de votre image de démarrage');
background-size: 100%;
}

Bien sûr, vous devez également utiliser les outils du SDK de Sencha pour compresser et minimiser vos fichiers.

III - Remerciements

Cet article a été publié avec l'aimable autorisation de Neil McGuigan. L'article original peut être lu sur le blog ExtJS Tutorials : ExtJS Faster Loading.
Je remercie également ram-0000 pour sa relecture rapide.