保存页面加载时间的提示

我的问题 :什么是最好的方法来削减那些不必要的kbs并使页面加载更快。所有优化实践+编码实践 (在js,php中)如果执行可以使您的页面更轻。

为什么我这样问 :我在jquery.js和jquery.min.js上阅读了这篇文章。我以为很多人在不知道它的含义的情况下使用它。我基本上是在android和ios手机上制作广告单元。所以在我的领域节省每一个kb变得非常关键 。 我最近开始使用jquery.min而不是简单的javascript.But再次增加了整体kbs大小。大爸爸谷歌在他们的页面排名哲学中跟踪这个方面。所以这个问题变得更加重要,在最顶层的搜索我确实在谷歌搜索,但没有一个链接提出了一些可靠的答案。

我想知道除了使用任何js库的缩小版本之外,人们应该怎么做才能使他们的网页在移动设备以及平板电脑和PC浏览器上更轻松 。 在某些时候,每个javascript编码器都必须考虑这个问题。

您可能希望研究WPO (Web性能优化)和/或FEO (前端优化)。

它已经过时但今天仍然适用: http : //stevesouders.com/hpws/rules.php

 Rule 1 - Make Fewer HTTP Requests Rule 2 - Use a Content Delivery Network Rule 3 - Add an Expires Header Rule 4 - Gzip Components Rule 5 - Put Stylesheets at the Top Rule 6 - Put Scripts at the Bottom Rule 7 - Avoid CSS Expressions Rule 8 - Make JavaScript and CSS External Rule 9 - Reduce DNS Lookups Rule 10 - Minify JavaScript Rule 11 - Avoid Redirects Rule 12 - Remove Duplicate Scripts Rule 13 - Configure ETags Rule 14 - Make AJAX Cacheable 

然后是雅虎的规则: http : //developer.yahoo.com/performance/rules.html

当然谷歌的推荐: https : //developers.google.com/speed/docs/best-practices/rules_intro

最后使用http://webpagetest.org测试您的网站

要利用并行下载和更常见的缓存,请使用CDN作为谷歌:

  

如果你只关心文件的大小,建立自己的jquery版本,删除你当前没有使用的东西:{你仍然可以把这个文件放在外部服务器上进行并行下载}

jQuery Builder(例如) (仅使用ajax和css模块缩小28.35 Kb)

超出主题

现在,关于动画的性能,如果你为此目的使用jquery,你应该看看GSAP jquery插件,它可以将性能提高到20倍: jQuery GSAP

请参阅速度测试页面以比较各个库: http : //www.greensock.com/js/speed.html

我想你正在考虑减少第一次访问或未缓存请求的页面加载,这意味着客户端必须下载所有资源。

减少jQuery的加载时间

使用第三方CDN -hosted jQuery

由于第三方CDN托管的jQuery库的广泛使用,大多数用户已经缓存了jQuery,这意味着您也可以通过使用相同的资源从中受益。 到目前为止最流行的是Google Hosted Libraries ,另一个是jQuery自己的CDN 。

使用第三方CDN托管的jQuery就像添加脚本标记一样简单:

  

注意:想知道url中省略的协议/方案? 请参阅Paul irish的Protocol-relative urls 。

使用第三方CDN的唯一缺点是,任何服务中断都会影响您的网站/广告。 但是,您的托管服务更可能被破坏,然后上述任何CDN:s。

定制的jQuery构建

如果您出于某种原因不想或不能使用第三方CDN托管,您还可以自定义您的jQuery构建,以仅包含您为项目使用/需要的部分。 为了简化构建过程,您可以使用这个名为jQuery Builder的强大工具。

jQuery的替代品

jQuery是一个非常繁重的库,有些人认为它非常适合移动设备。 那里的替代品旨在更小,更轻,如Zepto.js , Snack.js和$ dom 。

重要的是要注意,并非所有function和浏览器支持都将出现在备用库中,因此您需要确保获得所需的function。

我的其余代码怎么样?

在生产环境中提供服务时,应始终确保所有源代码都已缩小并压缩(即gzip)。 您还应尽量减少请求,因此将多个文件连接成一个文件既可以降低请求数量,又可以从缓存中获益更多。 这可以用于JavaScript以及CSS文件。

降低带宽对于缓存标题也很重要。

ETAG,If-Modified

当您从数据库中提取文章并将其显示在简化页面上时,您可以使用last_edit(示例)列作为Last-Modified标头,以便当客户端重新访问该文章时,可以从缓存中加载该文章。

您应该映射那些可以针对缓存进行优化的页面。

它不适用于带注释的页面,但是当通过按下按钮加载ajax时,它是可能的。

缺点是,在需要显示的内容不仅仅是那篇文章的页面上,它会变得相当复杂。