Ruby on Rails 向视图JavaScript传递数据的优选方案及优缺点对比

没有绝对的最优方案，需结合数据规模、业务迭代需求决定：

• 数据量小、无后续动态更新需求：方案1更简洁
• 数据量大、有数据刷新需求：方案2体验更优

优点 #

• 无额外网络请求，数据随页面渲染直接可用，不存在请求失败、弱网加载慢的问题
• 实现成本极低，无需额外开发接口、处理请求逻辑
• 不存在跨域、接口权限校验等额外适配问题

缺点 #

• 你提到的问题：数据量大时会导致HTML/JS文件体积膨胀，拖慢首屏渲染速度，页面源码可读性差
• 原写法存在语法风险：如果@result中包含单引号、换行符等特殊字符，会直接触发JS语法错误，建议改用更安全的写法：var data = <%= @result.to_json.html_safe %>;，无需手动包裹字符串和调用JSON.parse
• 数据和页面强绑定，无法单独缓存数据，若要更新数据必须重新渲染整个页面
• 如果开启了页面静态缓存，注入的数据也会被缓存，无法实现动态数据更新

优点 #

• 页面和数据加载解耦，首屏HTML体积小，渲染速度更快，可单独给数据接口配置缓存策略
• 代码可维护性更高，前后端职责清晰，JS代码可独立打包缓存
• 无需处理服务端注入的特殊字符转义问题，避免语法风险
• 支持后续动态刷新数据的需求，无需重载整个页面

缺点 #

• 你提到的问题：需要额外发起一次GET请求，增加网络开销
• 需要额外开发对应的数据接口，还要做加载态、请求异常兜底处理，实现成本更高
• 弱网环境下可能出现数据加载延迟、失败的问题，需要额外做兼容处理

如果你的pivottable展示的数据是固定报表、无刷新需求，且序列化后的@result大小在100KB以内，直接用修正写法后的方案1即可；如果数据量超过500KB，或者后续需要支持筛选、刷新数据的需求，优先选方案2。

内容的提问来源于stack exchange，提问作者Peabrain