这次不是推广,请求前端大佬帮忙分析一下崩溃原因

101 天前
 ted0220
之前开源过一款像素画游戏,用户反馈过移动端会卡死的情况,自己也遇到过两次,页面操作无响应,也无法点击刷新,只能关闭标签页重新打开,由于是偶发问题,一直无法定位到问题的位置,通过 window.onerror 也无法捕获错误信息,目前怀疑是 e-smart-zoom-jquery.js 插件大量操作 dom 节点导致的,有前端大佬能帮忙分析一下嘛,感激不尽

github 项目地址: https://github.com/tebie6/pixel-game

怀疑的 JS 文件 https://game.tebie6.com/static/pixel/js/e-smart-zoom-jquery.js?v=0.0.12
1671 次点击
所在节点    程序员
7 条回复
woshixiaoqianbi
101 天前
network 面板里勾上 memory 选项,录制一段时间内的操作分析下内存占用上的操作
LancerComet
101 天前
不是解决问题的,只是看了一下缩放的做法感觉很粗暴,Canvas 整个画布画出来之后用 DOM 的方式缩放,按道理也不是不行,只是额外引入了黑盒类库,你可以改成使用离屏 Canvas 做 bitmap 缓存,然后根据用户的视图区域、位置、缩放来从缓存里取必要的像素进行绘制,意思就是把缩放和移动挪到 Canvas 中实现,完全可以避免使用这种 DOM 缩放类库,可能会比较复杂,因为要维护摄影机的信息,几年前给比利比利做像素画板的时候就是这种实现,活动期间没有获得性能塌方反馈
ted0220
101 天前
@LancerComet 感谢分享,由于不是前端出身所以知识面比较局限,用的方式比较粗糙,后续会研究学习改进
godbasin
101 天前
一般崩溃有两种情况:
1. 内存暴涨导致崩溃,可以分析下内存情况
2. 死循环,在卡死的时候,去控制台点一下暂停执行,看看代码停留在哪个位置就可以
ted0220
101 天前
@godbasin 是的,因问题一般都是发生在手机浏览器上,所在出现问题时无法通过控制台排查问题
Zz09
101 天前
感觉也可能是定时器之类的没回收
godbasin
101 天前
@ted0220 手机也可以连电脑的,不过复现路径可能得找到,怀疑的地方可以埋点日志,崩溃的时候作为参考

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/1013031

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX