JavaScript 复杂计算留给浏览器端 JavaScript 计算

kevinhua · 2012年06月10日 · 最后由 lb563 回复于 2012年07月08日 · 3458 次阅读

一直为大量的数组计算影响服务器性能担忧,所以想了一个折中的方法,复杂计算留给浏览器端 JavaScript 计算。具体的步骤大概是这样的:

Helper 中新添一个方法,用于将数组赋给 html data:

# udentity和tdentity分别是User和Topic模型中的等长(长度为20)数组field
def get_dentity(topic)
  hover_txt = %(some html tag)
  ri_data = %(data-rateit-udenty="#{current_user.udentity.join(",")}" data-rateit-tdentity="#{topic.tdentity.join(",")}")
raw %(<span class="rateit-hover" style="vertical-align:top;padding-right:5px;">#{hover_txt}</span><div class="rateit" data-rateit-resetable="true" data-rateit-ispreset="true" data-rateit-step="1"  #{ri_data} ></div>)

然后在局部模板中引用

<span class="pull-right">
  <%= get_dentity(topic) %>
</span>

最后调用 JS 计算,并将计算后的结果用于设置

//set the value if we have it.
if (itemdata('tdentity') && itemdata('udentity')) {
  var tarr, uarr, i, sum, _i;

  tarr = itemdata('tdentity').split(",");
  uarr = itemdata('udentity').split(",");

  sum = 0;
  for (i = _i = 0; _i <= 19; i = ++_i) {
    sum += uarr[i] * tarr[i];
  }

  var score = ((sum / 50) - itemdata('min')) * itemdata('starwidth');
  item.find('.rateit-selected').width(score);
}
else if (itemdata('value')) {
  var score = (itemdata('value') - itemdata('min')) * itemdata('starwidth');
  item.find('.rateit-selected').width(score);
}

可以把网页做成客户端,然后从服务器调用数据,写入模板

为什么不用 gon 将数据传递到 js 中在计算? 这样就不用模板了

不安全啊

#3 楼 @foomorrow 不是只用在渲染模版的,不安全是哪个地方?

#2 楼 @chucai 赞成使用 gon 很方便.给个链接:https://github.com/gazay/gon

需要 登录 后方可回复, 如果你还没有账号请 注册新账号