加载优化
　　合并css javascript
　　合并小图片 使用雪碧图
　　缓存一切可缓存的资源
　　使用长的cache
　　使用外链式引用css,javascript
　　压缩HTML,CSS,JAVASCRPT
　　启用GZip
　　使用首屏加载
　　使用按需加载
　　使用滚屏加载
　　通过Media Query加载
　　增加Loading进度条
　　减少cookie
　　避免重定向
　　异步加载第三方资源
css优化
　　css卸载头部，javascript写在尾部或者异步
　　避免图片和iFrame等的空Src
　　尽量避免重设图片大小
　　图片尽量避免使用DataURL
　　尽量避免写在HTML标签中写Style属性
　　避免css表达式
　　移除空的css规则
　　正确使用Display的属性
　　不滥用Float
　　不刊用Web字体
　　不声明过多的font-size
　　值为0时不需要任何单位
　　标准化浏览器前缀
　　避免让选择符看起来像正则表达式
图片优化
　　使用智图 http://zhitu.tencent.com
　　使用(css3,scg,IconFont)代替图片
　　使用Srcset
　　webP优于GIF
　　PNG8优于GIF
　　首次加载大不于1014KB
　　图片不宽于640
　　脚本优化
　　减少重绘和回流
　　缓存Dom选择与计算
　　缓存列表
　　尽量使用时间代理，避免批量绑定事件
　　尽量使用ID选择器
　　使用touchstart,touchend代替click
渲染优化
　　HTML使用Viewport
　　减少Dom节点
　　尽量使用css3动画
　　合理使用requestAnmationFrame动画代替setTimeout
　　适当使用Canvas动画
　　Touchmove,Scroll事件会导致多次渲染
　　使用（css3 transtions,css3 3D transforms,Opacity,Canvas,webGL,Video）来出发GPU渲染

webapp前端性能优化规范的更多相关文章

  1. WebAPP移动前端性能优化规范和设计指导

  2. 移动H5前端性能优化指南

    移动H5前端性能优化指南 概述 1. PC优化手段在Mobile侧同样适用2. 在Mobile侧我们提出三秒种渲染完成首屏指标3. 基于第二点,首屏加载3秒完成或使用Loading4. 基于联通3G网 ...

  3. 阿里巴巴 web前端性能优化进阶路

    Web前端性能优化WPO,相信大多数前端同学都不会陌生,在各自所负责的站点页面中,也都会或多或少的有过一定的技术实践.可以说,这个领域并不缺乏成熟技术理论和技术牛人:例如Yahoo的web站点性能优化 ...

  4. 移动H5开发入门教程：12点webAPP前端开发经验

    如果你是一名移动H5前端开发人员,25学堂的小编认为下面的分享的12点webAPP前端开发经验是你必须掌握的基础知识点.算是一篇移动H5开发入门教程吧! 1. viewport:也就是可视区域.对于桌 ...

  5. 移动H5前端性能优化指南[转]

    移动H5前端性能优化指南 米随随2015.01.23 移动H5前端性能优化指南 概述 1. PC优化手段在Mobile侧同样适用2. 在Mobile侧我们提出三秒种渲染完成首屏指标3. 基于第二点,首 ...

  6. 移动 H5（PC Web）前端性能优化指南

    原文地址https://zhuanlan.zhihu.com/p/25176904?utm_source=wechat_session&utm_medium=social&utm_me ...

  7. [转]移动H5前端性能优化指南

    移动H5前端性能优化指南 概述 1. PC优化手段在Mobile侧同样适用2. 在Mobile侧我们提出三秒种渲染完成首屏指标3. 基于第二点,首屏加载3秒完成或使用Loading4. 基于联通3G网 ...

  8. CSS3与页面布局学习总结（八）——浏览器兼容与前端性能优化

    一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...

  9. 【前端构建】WebPack实例与前端性能优化

    计划把微信的文章也搬一份上来. 这篇主要介绍一下我在玩Webpack过程中的心得.通过实例介绍WebPack的安装,插件使用及加载策略.感受构建工具给前端优化工作带来的便利. 壹 | Fisrt 曾几 ...

随机推荐

  1. ASID 与 MIPS 中 TLB 相关

    ASID 为了提高TLB的性能,将TLB分成Global和process-specific.global 是指常驻在tlb中不会被刷出的,例如内核空间的翻译,process-specific 是指每个 ...

  2. Error:Execution failed for task ':app:processAnzhiDebugAndroidTestResources'. > No slave process to process jobs, aborting

    环境 Android Studio 3.0 错误 Error:Execution failed for task ':app:processAnzhiDebugAndroidTestResources ...

  3. jQuery多次选中checkbox失效

    在做项目的过程中,遇到一个问题.就是使用jquery的attr方法即 $("#aaa").attr('checked',true); $("#aaa").att ...

  4. lib 和 dll

    dll 和 lib只有在windows平台才会出现,老是忘记他们的区别和联系,记录一下,以备不时之需,也加深一下印象.  在弄懂两者的区别之前,需要知道两个概念: static library 和 d ...

  5. BZOJ2763: [JLOI2011]飞行路线(分层图 最短路)

    题意 题目链接 Sol 分层图+最短路 建\(k+1\)层图,对于边\((u, v, w)\),首先在本层内连边权为\(w\)的无向边,再各向下一层对应的节点连边权为\(0\)的有向边 如果是取最大最 ...

  6. php基础部分(1)

    PHP 输出文本的基础指令:echo 和 print.echo和print的区别echo是PHP语句, print和print_r是函数,语句没有返回值,函数可以有返回值(即便没有用)echo 输出一 ...

  7. 解决Non-resolvable parent POM: Could not find artifact 出现的问题

    在编译spring boot 多模块项目的时候,往往出现 Non-resolvable parent POM: Could not find artifact 后面跟一串其它信息,网上大部分解决方案是 ...

  8. 转 linux screen 命令详解

    一.背景 系统管理员经常需要SSH 或者telent 远程登录到Linux 服务器,经常运行一些需要很长时间才能完成的任务,比如系统备份.ftp 传输等等.通常情况下我们都是为每一个这样的任务开一个远 ...

  9. json字串转换成泛型类

    webrequst发送到指定的url using System; using System.Collections.Generic; using Newtonsoft.Json; using Syst ...

  10. 应该是很简单的事,关于SQL2005的视图浏览不排序问题

    http://bbs.csdn.net/topics/390667337?page=1