I have a rails application and the application.js after asset compilation takes more than 1 MB. This is slowing down my entire site.
我有一个rails应用程序和资产编译后的application.js需要超过1 MB。这会减慢我整个网站的速度。
I use Apache, Rails 4, jQuery, quite heavy JavaScript and AJAX. I would be very grateful if someone could point me in the right direction.
我使用Apache,Rails 4,jQuery,相当繁重的JavaScript和AJAX。如果有人能指出我正确的方向,我将非常感激。
2 个解决方案
#1
This may not be feasible in your particular case, but has certainly helped me keep Application.js from bloating.
这在您的特定情况下可能不可行,但肯定帮助我保持Application.js不会膨胀。
As I'm sure you know, Application.js compiles all specified files (by default, all of them) into a single .js file, which is loaded (again, by default) as part of your layout in every page. Often times this results in the inclusion of entirely unnecessary custom scripts loading in every page, and slowing down the entire application. I personally find this behavior undesirable. What I find works for my sites is only including my "core" javascript components in Application.js (jquery, bootstrap's js libraries, and any scripts that pertain to layout.html.erb itself), and specifying the rest in the pages that need them. For example:
我确定你知道,Application.js将所有指定的文件(默认情况下都是所有文件)编译成一个.js文件,该文件在每个页面中作为布局的一部分加载(默认情况下)。通常,这会导致在每个页面中加载完全不必要的自定义脚本,并减慢整个应用程序的速度。我个人认为这种行为不受欢迎。我发现我的网站的工作原理只包括我在Application.js中的“核心”javascript组件(jquery,bootstrap的js库,以及任何与layout.html.erb本身相关的脚本),并在需要的页面中指定其余部分。他们。例如:
application.js
Note that it does NOT include require tree .. This is important, as that is the line which specifies the inclusion of the entire assets/javascripts folder. "Template" in this case is the .js file a defined which pertains to layout.html.erb
请注意,它不包含require树。这很重要,因为这是指定包含整个assets / javascripts文件夹的行。在这种情况下,“模板”是定义的.js文件,它与layout.html.erb有关
//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require bootstrap-sprockets
//= require template
//= require turbolinks
layout.html.erb
The following is the very end of my layout, immediately before the closing body tag. This loads application.js on every page, and after that loads any js specified in the view.
以下是我的布局的最后一部分,紧接在关闭正文标记之前。这会在每个页面上加载application.js,然后加载视图中指定的任何js。
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<% if content_for?(:javascript) %>
<%= yield :javascript%>
<% end %>
The View(s)
In any view that requires page-specific javascript, you may specify the files with a Rails javascript helper
在任何需要特定于页面的javascript的视图中,您可以使用Rails javascript帮助程序指定文件
<% content_for :javascript do %>
<%= javascript_include_tag 'pages/profile', 'data-turbolinks-track' => true %>
<% end %>
initializers/assets.rb
Finally, make sure that your scripts are still being precompiled, even though they aren't a part of Application.js.
最后,确保您的脚本仍在进行预编译,即使它们不是Application.js的一部分。
Rails.application.config.assets.precompile += %w( pages/profile.js )
...or, more efficiently assuming you have many pages with their own scripts...
...或者,更有效地假设你有很多页面都有自己的脚本......
Rails.application.config.assets.precompile += %w( pages/* )
In Conclusion
I find this technique really helps keep the size of Application.js down, and makes for good practice in general. I hope you find it useful, and apologize if it is extraneous to your problem.
我发现这种技术确实有助于保持Application.js的大小,并且通常可以实现良好的实践。我希望你觉得它很有用,如果它与你的问题无关,就道歉。
#2
Have you ever thought about using the CDN hosted jQuery Version? Could you provide your uncompiled application.js.
你有没有想过使用CDN托管的jQuery版本?你能提供未编译的application.js吗?
You could also try to use browserify or require.js
您也可以尝试使用browserify或require.js
#1
This may not be feasible in your particular case, but has certainly helped me keep Application.js from bloating.
这在您的特定情况下可能不可行,但肯定帮助我保持Application.js不会膨胀。
As I'm sure you know, Application.js compiles all specified files (by default, all of them) into a single .js file, which is loaded (again, by default) as part of your layout in every page. Often times this results in the inclusion of entirely unnecessary custom scripts loading in every page, and slowing down the entire application. I personally find this behavior undesirable. What I find works for my sites is only including my "core" javascript components in Application.js (jquery, bootstrap's js libraries, and any scripts that pertain to layout.html.erb itself), and specifying the rest in the pages that need them. For example:
我确定你知道,Application.js将所有指定的文件(默认情况下都是所有文件)编译成一个.js文件,该文件在每个页面中作为布局的一部分加载(默认情况下)。通常,这会导致在每个页面中加载完全不必要的自定义脚本,并减慢整个应用程序的速度。我个人认为这种行为不受欢迎。我发现我的网站的工作原理只包括我在Application.js中的“核心”javascript组件(jquery,bootstrap的js库,以及任何与layout.html.erb本身相关的脚本),并在需要的页面中指定其余部分。他们。例如:
application.js
Note that it does NOT include require tree .. This is important, as that is the line which specifies the inclusion of the entire assets/javascripts folder. "Template" in this case is the .js file a defined which pertains to layout.html.erb
请注意,它不包含require树。这很重要,因为这是指定包含整个assets / javascripts文件夹的行。在这种情况下,“模板”是定义的.js文件,它与layout.html.erb有关
//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require bootstrap-sprockets
//= require template
//= require turbolinks
layout.html.erb
The following is the very end of my layout, immediately before the closing body tag. This loads application.js on every page, and after that loads any js specified in the view.
以下是我的布局的最后一部分,紧接在关闭正文标记之前。这会在每个页面上加载application.js,然后加载视图中指定的任何js。
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<% if content_for?(:javascript) %>
<%= yield :javascript%>
<% end %>
The View(s)
In any view that requires page-specific javascript, you may specify the files with a Rails javascript helper
在任何需要特定于页面的javascript的视图中,您可以使用Rails javascript帮助程序指定文件
<% content_for :javascript do %>
<%= javascript_include_tag 'pages/profile', 'data-turbolinks-track' => true %>
<% end %>
initializers/assets.rb
Finally, make sure that your scripts are still being precompiled, even though they aren't a part of Application.js.
最后,确保您的脚本仍在进行预编译,即使它们不是Application.js的一部分。
Rails.application.config.assets.precompile += %w( pages/profile.js )
...or, more efficiently assuming you have many pages with their own scripts...
...或者,更有效地假设你有很多页面都有自己的脚本......
Rails.application.config.assets.precompile += %w( pages/* )
In Conclusion
I find this technique really helps keep the size of Application.js down, and makes for good practice in general. I hope you find it useful, and apologize if it is extraneous to your problem.
我发现这种技术确实有助于保持Application.js的大小,并且通常可以实现良好的实践。我希望你觉得它很有用,如果它与你的问题无关,就道歉。
#2
Have you ever thought about using the CDN hosted jQuery Version? Could you provide your uncompiled application.js.
你有没有想过使用CDN托管的jQuery版本?你能提供未编译的application.js吗?
You could also try to use browserify or require.js
您也可以尝试使用browserify或require.js