Kineticjs 停止渲染

Posted

技术标签:

【中文标题】Kineticjs 停止渲染【英文标题】:Kineticjs stops rendering 【发布时间】:2013-08-24 07:57:34 【问题描述】:

使用 kinetic js 在信息亭上搜索目录列表。效果很好!!除了一个问题。我在 chrome 中,并且在用户可以单击以该字母开头的名称的一侧有一个 a、b、c、d 等列表。当一个字母被点击时,它会重新渲染整个舞台。这样做 10-15 次后,舞台出现空白,但我仍然可以单击名称所在的位置并获取其详细信息“灯箱”或单击字母所在的位置并获取新列表,但仍然是空白阶段,即在任何矩形或文本上没有填充或颜色。更糟糕的是,如果我去一个完全不同的信息亭页面,它使用 KineticJS 来做其他事情,它也不会呈现,而且永远不会再呈现,除非我离开域(本地主机)并去谷歌或其他东西然后回来,或者打开一个新标签页或重新启动 Chrome。我现在完全迷失了,如果我无法弄清楚这一点,那么在没有 Kinetic 的情况下重做将是一个巨大的损失。

我已经完成并尝试确保我的内存管理正常并且非常确定。我的系统内存确实增加了,但 Chrome 似乎很快就会收集垃圾。我什至尝试在重新渲染时对我创建的每个 kineticjs 对象调用 destroy() ,但没有成功。

【问题讨论】:

整个舞台是否需要重新渲染?您可以重新渲染图层,还是将每个列表作为单独的图层/组并根据需要隐藏/显示它们?我们需要查看一些代码(并且一个 jsfiddle 会很好)以提供进一步的帮助.. 我可能不必重新渲染整个舞台,但这是一个简单的解决方案,而且运行起来非常流畅。我的脚本有 800 多行,具有所有需要的功能(搜索、弹出键盘(也是 kineticjs)排序等)。我会尝试在 jsfiddle 中重新创建并尽快发布。 所以不重新渲染舞台似乎可以解决问题。这是一个很容易做出的改变,但现在它似乎更多地占用了内存。我将查看文档以确保我正确地重用它。感谢您的建议。 我仍然想知道为什么它会在同一个站点上完全不同的页面之间锁定它? 我现在正在重新使用 1 阶段对象,并有很大改进。我也尝试绘制所有 26 个(字母)图层并显示/隐藏它们,但它也非常昂贵。用户还可以拉起类似键盘的移动设备并搜索名称,匹配项将显示在同一阶段。我正在从 Active Directory 中提取该目录的数据(后端是 Django 服务器和每晚从 AD 发布的服务),并且有近 1000 个条目需要管理。我没有看到像这样使用它的响应能力有什么不同,但是加载时间会显着增加影响可用性。现在效果很好 【参考方案1】:

Chrome 29 中存在一个关于画布渲染的已知问题。版本 28 或 30 中不存在该问题。加入聚会并帮助吸引人们注意该问题。 :) https://code.google.com/p/chromium/issues/detail?id=280153&thanks=280153&ts=1377616231#makechanges

作为临时解决方法,您可以通过将“禁用加速 2D 画布”标志设置为启用来关闭 2D 画布加速。

【讨论】:

老兄!!我无法告诉你我与这个斗争了多久。它几乎使我的整个项目失败了。在 29 上禁用 2d 画布并移至 30 都处理了它。哦,好吧,我的 javascript 现在至少是绝对防弹的!!!非常感谢!! 很高兴能帮上忙!我也拉了一点头发。 谢谢,效果很好!现在,我如何让我的所有最终用户都这样做?

以上是关于Kineticjs 停止渲染的主要内容,如果未能解决你的问题,请参考以下文章

KineticJS教程(1-2)

使用 HTML5 Canvas 和 KineticJS 在 Android Webview 上平移、缩放性能不佳

Chrome 和 Opera 中的 Kinetic JS 性能问题

扩展 KineticJS - 自定义过滤器

html5 画布 kineticjs 事件

为啥 KineticJS 文档中没有方法 draw()?