recherche

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

angular.js - AngularJS 单页面应用首页加载优化有哪些方法？

传统网页的请求中，数据在服务器端加载到模板上，一步就可以完成。

  1. 下载 HTML
  2. 下载 CSS / javascript
  3. 渲染

单页面应用需要先下载框架，然后才能开始加载数据。

  1. 下载 HTML
  2. 下载 CSS / javascript
  3. 下载数据 / 模板
  4. 渲染

有什么办法减少请求次数，或是将这种串行加载变成并行的方法呢？

PHP中文网PHP中文网2745 Il y a quelques jours604

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