recherche

Maison  >  Questions et réponses  >  le corps du texte

angulaire.js - Quelles sont les méthodes pour optimiser le chargement de la page d'accueil des applications monopage AngularJS?

Dans les requêtes de pages Web traditionnelles, les données sont chargées dans le modèle côté serveur, qui peut être complété en une seule étape.

  1. Télécharger HTML
  2. Télécharger CSS/javascript
  3. Rendu

Les applications d'une seule page doivent télécharger le framework avant de commencer à charger les données.

  1. Télécharger HTML
  2. Télécharger CSS/javascript
  3. Télécharger les données/modèles
  4. Rendu

Existe-t-il un moyen de réduire le nombre de requêtes ou de transformer ce chargement en série en une méthode parallèle ?

PHP中文网PHP中文网2840 Il y a quelques jours665

répondre à tous(5)je répondrai

  • PHP中文网

    PHP中文网2017-05-15 16:52:28

    La solution parfaite est de restituer le premier écran côté serveur, mais Angular ne semble pas bon pour cela et je n'ai jamais vu de vraie solution

    Un peu pire, au moins le serveur peut cracher les premières données d'écran de la page

    La compilation et la fusion de certains autres modèles CSS et js de base devraient être les plus basiques

    répondre
    0
  • 阿神

    阿神2017-05-15 16:52:28

    Utilisez l'outil gulp
    Regroupez le CSS dans un fichier, le js dans un fichier et le modèle dans un fichier js ($templateCache), qui peut être empaqueté avec le fichier js.
    Ensuite il y a
    1 Téléchargez HTML (première demande, page purement statique, peut inclure du contenu de modèle angulaire, cette page devrait répondre rapidement)
    2 Téléchargez CSS (une demande)
    3 Téléchargez le fichier javascript et le fichier modèle js (une demande)
    4 page de rendu angulaire
    Un total de 3 requêtes + autres requêtes ajax sont effectuées.

    "gulp": "~3.8.0",
"gulp-angular-templatecache": "^1.4.2",
"gulp-compass": "^2.0.1",
"gulp-concat": "^2.4.1",
"gulp-jasmine": "^1.0.1",
"gulp-jshint": "~1.5.5",
"gulp-livereload": "~1.3.1",
"gulp-minify-css": "^0.3.10",
"gulp-minify-html": "^0.1.6",
"gulp-mocha": "~0.5.1",
"gulp-ng-annotate": "^0.3.5",
"gulp-nodemon": "^1.0.4",
"gulp-shell": "^0.2.10",
"gulp-uglify": "^1.0.1",

    répondre
    0
  • 怪我咯

    怪我咯2017-05-15 16:52:28

    Il est recommandé d'utiliser requireJs + angulaireJsAMD, qui peuvent être chargés à la demande.
    Transfert de lien : https://github.com/marcoslin/angularAMD

    répondre
    0
  • 我想大声告诉你

    我想大声告诉你2017-05-15 16:52:28

    angularjs fait plus de 170 Ko après compression. S'il est côté mobile, vous devriez le considérer côté PC. . Je ne pense pas que vous deviez y prêter trop d'attention. Si vous regardez les ressources m sur le front-end de teambition, ce n'est pas seulement un chargement

    .

    répondre
    0
  • 大家讲道理

    大家讲道理2017-05-15 16:52:28

    En partant du business et de la conception, des outils couramment utilisés tels que grunt peuvent empaqueter lib.min.js pour un chargement unique, et un chargement paresseux très couramment utilisé

    répondre
    0
  • Annulerrépondre