简体   繁体   English

你的rails应用程序如何包含javascript?

[英]How does your rails app include javascript?

I'm very curious how your Rails apps include javascript. 我很好奇你的Rails应用程序如何包含javascript。 For example: 例如:

  • do you package all your js code into a single file and serve it for all requests? 你把所有的js代码打包成一个文件并为所有请求提供服务吗?
  • do you conditionally load certain js depending on controller/action? 你有条件地加载某些js取决于控制器/动作?
  • what tools or techniques do you use, ie: asset_packager, yui compressor, sprockets, BigPipe inspired implementation? 您使用什么工具或技术,即:asset_packager,yui压缩器,链轮,BigPipe启发实现?

A bit of background: I work on a massive Rails app that is very JS heavy. 一点背景:我正在开发一个非常JS的大型Rails应用程序。 Currently, all js is minified and served from a single file. 目前,所有js都被缩小并从单个文件中提供。 This makes things very convenient as all frameworks and widgets are available everywhere. 这使得事情变得非常方便,因为所有框架和小部件都可以在任何地方使用。 I'm beginning to question this approach is it seems a bit crazy to make all users pay the price for some js that they may never see. 我开始质疑这种方法是让所有用户付出他们可能永远看不到的一些js的价格似乎有点疯狂。 Littering the code with script includes seems crappy and difficult as large portions of the site deliver content via ajax. 由于网站的大部分内容通过ajax提供内容,因此使用脚本包含乱码代码似乎很糟糕且困难。

Anyone have any advice to share? 有人有任何建议可以分享吗?

Thanks much! 非常感谢!

There are several trade-offs to consider: 需要考虑几个权衡因素:

  • If you have one big JS file then it should be cached for all your pages. 如果你有一个大的JS文件,那么应该为你的所有页面缓存它。 But if only a few pages use JS then this isn't good. 但是如果只有几页使用JS那么这就不好了。
  • If your pages don't share JS then you may want to use "as needed" loading for each page's individual JS. 如果您的页面不共享JS,那么您可能希望为每个页面的单个JS使用“按需”加载。 But you don't want too many loads since each JS fetch has its own overhead. 但是你不需要太多的加载,因为每个JS fetch都有自己的开销。

Notes 笔记

  • Make sure all of your JS will be cached forever on your clients. 确保所有JS都将永远缓存在您的客户端上。 Use version numbers in the file names or urls (foo.js?123) 在文件名或URL中使用版本号(foo.js?123)
  • Make sure that JS files are minimized. 确保JS文件最小化。
  • Make sure web server has gzip encoding turned on. 确保Web服务器已打开gzip编码。
  • You may want to use a low-cost content delivery network for your JS such as Amazon's Cloudfront or one of their competitors. 您可能希望为您的JS使用低成本的内容交付网络,例如亚马逊的Cloudfront或其竞争对手之一。

Answers to your specific questions 回答您的具体问题

Do you package all your js code into a single file and serve it for all requests? 您是否将所有js代码打包到一个文件中并为所有请求提供服务?

All requests get a large file of JS that has library code and JS used on most pages. 所有请求都获得一个JS的大文件,其中包含库代码和大多数页面使用的JS。 Some specific pages also get an additional JS file. 某些特定页面还会获得额外的JS文件。

do you conditionally load certain js depending on controller/action? 你有条件地加载某些js取决于控制器/动作?

Yes, for a couple of very heavy JS pages, those pages get an additional JS file. 是的,对于几个非常重的JS页面,这些页面会获得一个额外的JS文件。 All pages get the reg JS file and it is cached/available for all pages. 所有页面都获得了reg JS文件,并且它被缓存/可用于所有页面。

what tools or techniques do you use, ie: asset_packager, yui compressor, sprockets, BigPipe inspired implementation? 您使用什么工具或技术,即:asset_packager,yui压缩器,链轮,BigPipe启发实现?

  • YUI Compressor YUI压缩机
  • S3 for serving my assets.foo.com domain S3用于提供我的assets.foo.com域名
  • rake tasks to merge/minimize multiple JS source files rake任务合并/最小化多个JS源文件

First of all, try this plugin for Firefox: http://developer.yahoo.com/yslow/ . 首先,尝试使用Firefox的这个插件: http//developer.yahoo.com/yslow/ It will help you determine sources of slowness, and can analyze your script usage and suggest improvements. 它将帮助您确定缓慢的来源,并可以分析您的脚本使用情况并提出改进建议。

Also, check out this article from Yahoo on best practices for fast websites: http://developer.yahoo.com/performance/rules.html . 另外,请查看雅虎关于快速网站最佳做法的文章: http//developer.yahoo.com/performance/rules.html This advice applies to all websites, not just rails. 此建议适用于所有网站,而不仅仅是rails。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM