Tag: pagespeed

我应该以编程方式embedded所有CSS文件以优化页面加载速度吗？: Google PageSpeed经常build议优化CSS传递。我想到，它会减lessnetworking往返内联所有的CSS，如下所示： <style type="text/css"> @{ var bootstrap = File.ReadAllText(Server.MapPath("bootstrap.min.css")); var bootstrapTheme = File.ReadAllText(Server.MapPath("theme.min.css")); var fontAwesome = File.ReadAllText(Server.MapPath("font-awesome.min.css")); var bigfont = File.ReadAllText(Server.MapPath("bigfont.min.css")); var bigfontPrint = File.ReadAllText(Server.MapPath("bigfont-print.min.css")); } @Html.Raw(bootstrap) @Html.Raw(bootstrapTheme) @Html.Raw(fontAwesome) @Html.Raw(bigfont) @Html.Raw(bigfontPrint) </style> 这似乎是一个合理的解决scheme，页面加载速度慢的问题，并已从88增加我的PageSpeed分数为95。把代码风格放在一边，如果有的话，技术上的原因是不是以这种方式embedded所有的CSS？

可能推迟加载jQuery？: 让我们面对它，jQuery / jQuery-ui是一个沉重的下载。 Googlebuild议延期加载JavaScript以加速初始渲染速度。我的页面使用jQuery来设置一些低页面上的标签（主要是初始视图），我想推迟jQuery，直到页面已经呈现。 Google的延期代码在页面加载之后，通过挂载到onLoad事件中，为DOM添加一个标签： <script type="text/javascript"> // Add a script element as a child of the body function downloadJSAtOnload() { var element = document.createElement("script"); element.src = "deferredfunctions.js"; document.body.appendChild(element); } // Check for browser support of event handling capability if (window.addEventListener) window.addEventListener("load", downloadJSAtOnload, false); else if (window.attachEvent) window.attachEvent("onload", downloadJSAtOnload); else window.onload = downloadJSAtOnload; </script> […]

Google的Page Speed无损图像压缩是如何工作的？: 当您在网站上运行Google的PageSpeed Firebug / Firefox插件时，会提示可以无损压缩图像的情况，并提供下载这个较小图像的链接。例如：无损压缩http://farm3.static.flickr.com/2667/4096993475_80359a672b_s.jpg可以节省33.5KB（减less85％）。无损压缩http://farm2.static.flickr.com/1149/5137875594_28d0e287fb_s.jpg可节省18.5KB（减less77％）。无损压缩http://cdn.uservoice.comhttp://img.dovov.comwidgets/en/feedback_tab_white.png可节省262B（减less11％）。无损压缩http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/basehttp://img.dovov.comui-bg_flat_75_ffffff_40x100.png可节省91B（减less51％）。无损压缩http://www.gravatar.com/avatar/0b1bccebcd4c3c38cb5be805df5e4d42?s=45&d=mm可节省61B（减less5％）。这适用于JPG和PNG文件types（我还没有testingGIF或其他）。还要注意Flickr的缩略图（所有这些图像都是75×75像素）。这是相当大的节省。如果真的如此伟大，雅虎为什么不把这个服务器端应用到他们的整个库中，并减less他们的存储和带宽负载？即使Stackoverflow.com代表一些非常小的节省：无损压缩http://sstatic.net/stackoverflow/img/sprites.png?v=3可以节省1.7KiB（减less10％）。无损压缩http://sstatic.net/stackoverflow/img/tag-chrome.png可以节省11B（减less1％）。我已经看到，PageSpeedbuild议使用Photoshop创build的“Save for Web”function来创build相当不错的PNG文件。所以我的问题是，他们对图像做了哪些改变以减less这些图像呢？我猜不同的文件types有不同的答案。这对JPG是否真的无损？他们怎么能打败Photoshop？我应该对此有点怀疑吗？

Google Analytics的PageSpeed Insights 99/100 – 如何cachingGA？: 我正在寻求在PageSpeed达到100/100，我几乎在那里。我试图find一个很好的解决scheme来cachingGoogle Analytics。这是我得到的消息：利用浏览器caching设置静态资源的HTTP头中的有效期限或最大使用期限指示浏览器从本地磁盘加载之前下载的资源，而不是通过networking加载。利用浏览器caching提供以下caching资源： http : //www.google-analytics.com/analytics.js （2小时）我发现唯一的解决scheme是从2012年，我不认为这是一个很好的解决scheme。从本质上讲，您可以复制GA代码并自行托pipe。然后，您运行一个cron作业，每天重新检查Google一次，以获取最新的GA代码并将其replace。 Leverage Browser Cache Optimize Google Analytics 在使用Google Analytics（分析）时，还可以做些什么来达到100/100？谢谢。

“在上面的内容中消除渲染阻塞CSS”: 我一直在使用Google PageSpeed的见解来改善我的网站的性能，到目前为止它已经被certificate是非常成功的。诸如推迟脚本之类的工作的效果非常好，因为我已经有了jQuery的.ready()的内部版本来推迟脚本，直到页面完全加载完毕，我所要做的就是内联该特定的函数，并将完整的脚本移动到末尾的页面。这很好。但是现在我发现自己瞪着检查清单上剩下的一个黄点：“在上面的内容中去掉渲染阻塞的CSS”。我的CSS设置的方式是有一个全局_.css文件，其中包含一般适用于页面结构的样式，或者在整个网站的多个或两个位置使用。大多数页面都有一个关联的CSS文件（例如， party.php具有party.css ），其中包含特定于该特定页面的样式。所有的CSS文件被无限期地caching，因为我追加了/t=FILEMTIME到文件名（以后用.htaccess删除它们），以保证文件在更改时被更新。因此，无论如何，Googlebuild议内联重要内容所需的关键样式。麻烦是…好吧，看看这个截图： http : //prntscr.com/1qt49e 正如你所看到的… 所有的内容都是在折叠之中！人们讨厌滚动，特别是在涉及加载许多页面的游戏上。所以我devise的网站适合在一个屏幕上（假设足够好的分辨率）。所以这意味着… 所有的风格都适用于上面的内容！所以…有什么解决办法吗？还是我坚持那个黄色的标记呢？