zoukankan      html  css  js  c++  java
  • 提高网站访问速度缩短网页加载时间的一点总结

    一、前言

    怎样最大程度提高网站访问速度缩短网页加载时间,这是一个前端er工作中应该时常注意的问题。下面是总结日常开发中常用的办法。

    二、各种方法

    1、减少http请求

      雪碧图

           图片文字font-awsome

      Inline image(base64)

      合并请求,非继承的请求可以并发请求如:promise.all()

    2、css格式定义放置在文件头部

      对于网络条件不好情况下使用比较有利,可以在网页逐步呈现的同时仍会保持格式信息,不至于有错乱的感觉;

    3、Js脚本放在文件末尾

      主要是因为页面解析过程中,很多Javascript脚本执行效率低下,或者有的第3方域名脚本出现意外无法载入,如果将这些脚本放置到页面比较靠前的位置,可能会导致我们自己网站的内容载入速度下降甚至无法正常加载,所以一般将这些脚本放置在网页文件末尾,也可以考虑异步加载的形式;

    4、css、js改由外部调用

       如果css、js内容比较庞大,尽量不要写到同1个页面中去,改由外部载入比较妥当,有效利用css、js文件进行缓存。 

    5、压缩代码

      这点必须的。

    6、 避免301和302重定向;

      重定向会增加http请求的次数,会影响到整个网站的性能。但是还是看权衡吧,有时候又可以提高用户体验。

    7、Ajax调用尽量采用GET方法调用

      实际使用XMLHttpRequest时,如果使用POST方法实现,会发生2次HTTP请求,而使用GET方法只会发生1次HTTP请求。如果改用GET方法,HTTP请求减少50%!看情况吧。

    8、懒加载或者分页加载

      不在首屏的内容可以进行懒加载

    9、减少不必要dom元素  

    10、添加文件过期或缓存头部,配置ETags等

      对于同一用户频繁访问的图片、Js脚本文件等可以在Apache或Nginx设置其缓冲时间

    11、服务开启gzip压缩和使用cnd网络加速服务

      一般cnd都会默认开启压缩模式。

    12、服务器端直出

      php的直出模式挺好,对seo非常友好,但是不利于前后端分离;可以使用vue-ssr等服务端渲染,现在很多都流行首屏服务端渲染模式。

      具体还得看想要怎么样的效果,然后权衡吧。

    -----------------------------------------------------------------------------------------------------------------------------

    !!!养成良好代码习惯,提高代码性能,减少重复的代码。

  • 相关阅读:
    (HDU)1097 --A hard puzzle(难题)
    (HDU)1096 --A+B for Input-Output Practice (VIII)(输入输出练习(VIII))
    PAT B1008——数组元素循环右移
    test
    vue iconfont矢量图
    css3简单旋转
    vue 路由的安装及使用
    vue 父组件与子组件之间的相互调用
    vue 脚手架安装
    PHP 加密方式
  • 原文地址:https://www.cnblogs.com/leaf930814/p/8984361.html
Copyright © 2011-2022 走看看