<div id="vodid1">第一个按钮直接显示</div>
<input type="submit" value="" style="width: 1pxheight: 1pxbackground-color: transparentborder: 0FILTER: alpha(opacity=0)" />
间隔线来咯---------------------
<div id="vodid2">第二个按钮/图片，延迟加载显示</div>//广告位置,想延迟加载
<script type="text/javascript">
var html="<img src='http://static.cnblogs.com/images/logo_small.gif'/>"
setTimeout("document.getElementById('vodid2').innerHTML=html",5000)//延时5秒
</script>
1．把 CSS 资源引用放到 HTML 文件顶部一般推荐将所有 CSS 资源尽早指定在 HTML 文档
中，这样浏览器可以优先下载 CSS 并尽早完成页面渲染。
2．JavaScript 资源引用放到 HTML 文件底部
JavaScript 资源放到 HTML 文档底部可以防止 JavaScript 的加载和解析执行对页面渲染造成阻塞。由于 JavaScript 资源默认是解析阻塞的，除非被标记为异步或者通过其他的异步方式加载，否则会阻塞 HTML DOM 解析和 CSS 渲染的过程。
3．尽量预先设定图片等大小
在加载大量的图片元素时，尽量预先限定图片的尺寸大小，否则在图片加载过程中会更新图片的排版信息，产生大量的重排
4．不要在 HTML 中直接缩放图片
在 HTML 中直接缩放图片会导致页面内容的重排重绘，此时可能会使页面中的其他操作产生卡顿，因此要尽量减少在页面中直接进行图片缩放。
5．减少 DOM 元素数量和深度
HTML 中标签元素越多，标签的层级越深，浏览器解析 DOM 并绘制到浏览器中所花的时间就越长，所以应尽可能保持 DOM 元素简洁和层级较少。
6．尽量避免在选择器末尾添加通配符
CSS 解析匹配到 渲染树的过程是从右到左的逆向匹配，在选择器末尾添加通配符至少会增加一倍多计算量。
7．减少使用关系型样式表的写法
直接使用唯一的类名即可最大限度的提升渲染引擎绘制渲染树等效率
8．尽量减少使用 JS 动画
JS 直接操作 DOM 极容易引起页面的重排
9．CSS 动画使用 translate、scale 代替 top、height
尽量使用 CSS3 的 translate、scale 属性代替 top、left 和 height、width，避免大量的重排计算
10．尽量避免使用 table、iframe
table内容的渲染是将 table 的 DOM 渲染树全部生成完并一次性绘制到页面上的，所以在长表格渲染时很耗性能，应该尽量避免使用它，可以考虑使用列表元素 ul 代替。尽量使用异步的方式动态添加 iframe，因为 iframe 内资源的下载进程会阻塞父页面静态资源的下载与 CSS 及 HTML DOM 的解析。
11．避免运行耗时的 JavaScript
长时间运行的 JavaScript 会阻塞浏览器构建 DOM 树、DOM 渲染树、渲染页面。所以，任何与页面初次渲染无关的逻辑功能都应该延迟加载执行，这和 JavaScript 资源的异步加载思路是一致的。
12．避免使用 CSS 表达式或 CSS 滤镜
CSS 表达式或 CSS 滤镜的解析渲染速度是比较慢的，在有其他解决方案的情况下应该尽量避免使用
J s延迟加载的方式有哪些？
给javascript标签添加 defer和async属性。
defer和async的区别是什么？
1、defer和async都是使script异步加载的意思，当都没有设置这个属性的时候，html的加载会被阻塞等着script加载完成和执行完成后再渲染页面。
2、当设置了async时，异步加载，一旦加载完成则阻塞html渲染，进行执行，而且如果有多个script标签则谁先加载完，谁先执行。
3、当设置了defer时，异步加载，不会阻塞html，待html渲染完毕后再进行script执行。
注意：ie只支持defer
