zoukankan      html  css  js  c++  java
  • 网站前台性能优化教程



    之前一系列博文介绍了网站后台的数据库性能优化,其实前端的优化也是很重要的。在数据库范文速度提升上去的时候,仍然会出现页面加载缓慢的现象,此时,就需要对于网站的前端代码进行优化。

     

    关于前端性能优化的教程不多,好不容易找到了一本教材,《高性能网站建设指南》,下面以此书的内容为主线,讲解一下前端性能优化的方法。

     


     

    一、           减少http请求

    这是提高前端性能的一个重要原则。

    能少一次请求就少一次。

     

    1.      使用图片地图

    我们知道,一个img标签会向服务器发起一次请求获取图片,那么如果把多个图片合成一张图片,就可以将多次请求变成一次请求了,这就是图片地图。

    图片地图通过用户点击的位置不同而相应不同的事件,这样就会使得前台代码变得较复杂,难以看懂,个人觉得不太可行。

     

     

    2.      合并JavaScript和Css文件

    一个script标签或者link标签也会向服务器发起一次请求,所以必须减少页面中引用外部文件的次数。一般来说,一个页面配一个JS和一个CSS。

     

    3.      避免重定向

    重定向也会发出Http请求。

     

    二、           使用内容发布网络

           该系统会自动选取与用户最近的服务器。

     

    三、           使用缓存

    1.      指定Expire头

    给组件使用Expire指定使用缓存

    也可以使用Cache-Control:max-age=315360000代替

     

    2.      使用外置的Js和Css文件

           内置的js和css通常不会被缓存。

     

    四、           压缩组件

           将代码进行精简。有其是Js代码

           主要方法有,将空格删除,将较长变量名用v_1、v_2之类代替

           工具:gzip

     

    五、           将CSS文件放在顶部

           这样可以使得页面逐步加载呈现,增强用户体验,防止白屏。

     

    六、           将JavaScript文件放在底部

    防止下载脚本阻塞了页面显示。

     

     

    JavDroider's Blog   欢迎批评建议~~

     

  • 相关阅读:
    逆向工程工具介绍2-IDA
    汇编语言基础-1 基本语言元素
    Python常用标准库1-Turtle,Random,Time和Datetime
    Python的模块、包和库的概念
    Go语言的函数修饰符
    物理层2-物理层下面的传输媒体
    数据分析之两种用户分群方法(RFM和聚类)
    区间估计与假设检验公式
    源码分析过滤器与拦截器的区别
    Springboot拦截器使用及其底层源码剖析
  • 原文地址:https://www.cnblogs.com/javdroider/p/5184302.html
Copyright © 2011-2022 走看看