Javascript 保持页面状态 - 最佳实践？答案

【问题标题】：Javascript holding page state - best practises?Javascript 保持页面状态 - 最佳实践？
【发布时间】：2011-12-20 13:08:41
【问题描述】：

我正在使用 ruby on rails 对 Web 应用程序进行原型设计。

我是 Rails 的新手，但这个问题通常与 MVC 编程有关。

过去，当我的模型包含一些需要从我的 javascript 文件中访问的相关信息时，我会在我的模板中包含一些内联 javascript 并将其转储到一个全局变量中：

<script type="text/javascript"> 
    var nodes=<%= @nodes.to_json.html_safe %>;
</script>

但是，在生产中，我的计划是使用 uglifier 来压缩我的 javascript 文件，我的猜测是它不会知道重命名我的 erb 文件中的节点变量以与缩小的 javascript 同步。

（我在想将它存储在一个命名的隐藏输入中可能会解决缩小问题，但感觉更hacker...）

所以我的问题是：

您能否提出比在全局命名空间中转储 json 对象更优雅的存储页面状态的替代方法？

最好在 Rails 中，但我也有兴趣看看人们如何在其他 mvc 框架中解决这个问题...

谢谢

【问题讨论】：

【解决方案1】：

内联 JavaScript 很糟糕。当您将 JS 值创建为字符串时，它会翻倍。它会产生可维护性问题，应该永远从你的技巧包中消除。 JavaScript 属于外部 JavaScript 文件，这些文件应该是静态的。

你想要的是这样的：

（查看文件）

<div id="nodes"><%= @nodes.to_json %></div>

(CSS)

#nodes { display: none; }

(JavaScript)

var nodes = JSON.parse($('#nodes'))

无论您的服务器端语言如何，这都是正确的。

额外的 Rails 特定提示：使用 Haml 代替 ERb，使用 Sass 代替 CSS。好多了。

【讨论】：