如何优化javascript资产?

时间:2013-10-14 23:56:41

标签: ruby-on-rails ruby-on-rails-3 asset-pipeline

我已经完成了我的项目,似乎工作正常。

但是,我刚刚发现优化还有很多事情要做。

Google的PageSpeed Insight刚刚告诉我 我必须Remove Render-Blocking JavaScriptsOptimize CSS DeliveryLeverage Browser Caching

关于Remove Render-Blocking JavaScriptsLeverage Browser Caching,它说我必须使用我的资产Javascripts。

他们目前在视图中说明如下

<%= javascript_include_tag 'application.js' %>
<%= javascript_include_tag 'illuminate.js' %>
<%= javascript_include_tag 'bootstrapSwitch.js' %>
<%= javascript_include_tag 'bootstrap.js.coffee' %>
<%= javascript_include_tag 'rails.js' %>

和它的html输出就是这个

<script src="/assets/application-21cb698a1b325807d74e3f5588e.js" type="text/javascript"></script>
<script src="/assets/illuminate-1a2b0535b4a3f7468aec74882e25f3.js" type="text/javascript"></script>
<script src="/assets/bootstrapSwitch-ae37e5eb28f943501b59b08ac6234.js" type="text/javascript"></script>
<script src="/assets/bootstrap-1b52926900736585a26c3fe0975f73.js" type="text/javascript"></script>
<script src="/assets/rails-e46b066113d4a1ff96120b8493021d9.js" type="text/javascript"></script>

如何进行更改以更改此内容以进行存档?

和约Optimize CSS Delivery,它说我必须优化这些

<%= stylesheet_link_tag "application","http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/smoothness/jquery-ui.css" %>
<%= stylesheet_link_tag 'bootstrapSwitch' %> 

这是它的html输出

<link href="/assets/application-e8a61afef574ba15cb71a3730d2b6b8e.css" media="screen" rel="stylesheet" type="text/css" />
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/smoothness/jquery-ui.css" media="screen" rel="stylesheet" type="text/css" />
<link href="/assets/bootstrapSwitch-b3ea2e51b3529f79637f5a8a9ef54712.css" media="screen" rel="stylesheet" type="text/css" />

如何修改所有这些?

1 个答案:

答案 0 :(得分:1)

尝试:

1)minifying你的javascripts:尺寸越小,你的网页加载速度越快

2)使用CDN托管资产:这有助于加快资产加载速度,从而缩短响应时间

3)@depa在rails中提供了一些很好的指向资产管道的指针,同时也检查了

你会很好。