页面性能及代码优化的实现

一:为什么要优化性能

最重要的就是为了提高用户的体验

二:代码方面

1:代码做到结构语义化:(不要出现style和onclick这样的内联的样式和事件 注意行为 表现 结构的分离)

2:减少DOM访问(很重要)

3:精简代码:(1:清理代码垃圾 2:html标签转换 (使用短标签去替换可以实现相同效果的长标签)3:css优化 4:js和表格优化)

三:文件使用和放置方面:

1:样式放在顶部 脚本放在底部  采用外联式 

2:用link代替@import

四:减少http请求

1:用图片精灵 将多个图片定位合成一张

2:不要再html中缩放图像 

3:字体图标要小而且可以缓存

4:把缓存时间设置长一些

5:图片预加载

6:非必须组件延迟加载

7:将资源放在不同域下 增加域

8:AJAX用gey请求

9:减少DNS查询 

10:避免重定向(会重绘页面)

五:cookie方面

1:减少cookie大小

2:引入的资源的域名不要包含cookie

六:server方面

1:CDN:分发网络(其基本思路是尽可能避开互联网上有可能影响数据传输速度和稳定性的瓶颈和环节,使内容传输的更快)

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 175,856评论 25 709
  • 网站优化离不开前后端的互相协作,但是对于前端工程师来说,在保证后端技术方案不变时,能不能只利用前端技术来优化网站呢...
    留七七阅读 11,495评论 0 31
  • 今天在写逻辑的时候,因为一个数据结构,搞得自己受不了了,到最后只好忍着性子把结构重新改了一遍,这也告诉自己,写程序...
    抓不住的风阅读 3,547评论 0 3
  • 璲心堂|七璲 作 柳无色,月成舟,芳无形夜初冬。草野灰,黄满堆,花蕊入化冢。 庭闲空,枫独红,秋去踪瘦梧桐。心芷...
    安步斋阅读 1,885评论 3 1
  • 知识付费市场现状 自2016年起,互联网进入知识经济时代,知识付费概念全面爆发。我们先来看看下面几组数据: 喜马拉...
    Anty阅读 6,481评论 2 21