前端性能优化的总结
前端性能的总结记录：
1、实现html的语义化
语义化是指用合理HTML标记以及其特有的属性去格式化文档内容。通俗地讲,语义化就是对数据和信息进行处理,使得机器可以理解.
语义化的(X)HTML文档有助于提升你的网站对访客的易用性，比如使用PDA、文字浏览器以及残障人士将从中受益。对于搜索引擎或者爬虫软件来说，则有助于它们建立索引，并可能给予一个较高的权值。
一般来说语义化的好处是为了搜索引擎，和适配阅读器，对于性能的优化效果不是特别明显。
2、css，js文件数量及大小的优化
要求css与js文件引入的时候需要进行压缩，有助于页面渲染前，下载速度的提升。每次页面加载都要想服务器发出请求，下载外联的文件，越小进入下一步的速度越快
3、css文件放在head中，js内联的文件放在body的最后位置
html页面的渲染操作是在body中开始的，至上而下逐步渲染，因为js文件经常会包含对于页面元素的改变。因此，页面对于js内容进行了所谓的阻塞处理，即加载js模块时，页面渲染停止，加载完之后再进行渲染。为了避免阻塞，js模块放在body中的末尾位置，以防阻塞。外联的css与js文件要放在head中，这些内容会在渲染前下载。
4、使用外部javascript和CSS
外部的可以被缓存，多个页面可以调用
5、避免重定向
6、js的代码精简，规范化编写
7、图标可以用绘图来代替
多个图标可以放在一张图里，然后通过定位来获取相应的图标，避免重复的下载，多次的http请求
1 <style>2 .icon{background: url("Icons.png") -112px -78px; width:32px;height: 35px; border: 0px;cursor: pointer;}3 </style>4 <body>5 <div class="icon"></div>6 </body>
上面的代码会选中图内的垃圾桶图标。
待续
