head.js和响应式网页设计

Question

我一直在研究响应式网页设计技术和head.js,我有几个问题.

• 在延迟加载外部js文件时,你有多少经验减少了head.js的加载时间？
• 需要多少额外的开发/工作来防止Flash出现无格式内容问题？
• head.js的所有CSS功能是否有助于创建响应式设计(针对不同大小的屏幕,设备等)？
• head.js是否会延迟加载图像和插件？

当我们尝试完成以下事情时,人们会推荐一些不同的东西:

• 大量javascript文件的快速,高效加载时间
• 减少开发时间并增加多个设备的屏幕尺寸
• 大规模应用程序的可扩展性
• 遵循最佳做法

任何意见都表示赞赏,谢谢.

Answer 1

我的两分钱:

我在head.js上遇到了一些问题,并最终选择使用script.js进行异步Javascript加载.对于我正在处理的网站,大多数功能都是静态的或具有后备功能.FOUC问题通常通过隐藏内容(使用css)直到加载javascript(然后使用javascript显示)来缓解.而且因为Javascript被缓存,我只需要担心第一页加载.

Modernizr为您提供head.js的所有功能检测.用html5shiv捆绑它,你从head.js获得HTML5 IE引导.CSS3媒体查询最适合响应屏幕宽度(并且respond.js可用于添加对IE 6-8的支持).这些脚本可能最好用传统<script>标签而不是异步加载器加载.理想情况下,它们都被压缩成一个文件.

Modernizr会自动使用.no-jsCSS类隐藏任何内容.我还发现创建一个.js类,将其隐藏在CSS文件中,并在任何必要的脚本完成后使用javascript显示它会很有帮助.

不必在<script>标记中加载jQuery和一堆插件肯定会对加载时间感知产生影响.也许某些行为不会持续几秒钟,但哦,好吧.顺便说一句,为了避免FOUC或Flash未定义的行为问题,jQuery liveQuery插件很棒.内联工作也是如此,但......