漫画小程序开发小结

最近基于公司业务需要，做了个漫画小程序，做博一篇，让后人少走弯路，同时也是对自己工作的一点提炼。
免得以后人老色衰记忆减退回首往事徒留伤悲。

页面：

• index：漫画列表，可续读直接跳阅读页
• detail：漫画详情，包含介绍和选集两个tab
• read：漫画阅读，无限滚动，懒加载，动态设话的标题

从需求和bug 谈技术实现

主页：无难点
详情：话的排序：前端排序，Array.reverse()即可
阅读页：

1. 漫画图片url获取：前后端约定url规则，前端拼接即可。开始考虑图片hash值命名增强安全，基于开发时间要求先放弃，后期增加收费漫画后，考虑增加cdn校验。

2. 防网络卡而加载缓慢：利用小程序image组件lazy-load实现图片懒加载，小程序自行判断懒加载时机，加载成功触发bindload事件（），失败触发binderror事件

3. 防页小程序面图片过多内存过大被系统清理：用scroll-view包裹image，滚动时获取图片位置要素，将不需要展示的图片url置为一张白色占位小图（对图片对象设一个flag，不置空的原因是置空了会触发binderror），占位保留，减少内存占用：
   wx.createSelectorQuery().selectAll('.img').boundingClientRect(ret => {// 代码})

这么做的原因是自己测试了一下使用lazy-load api时的效果，不做其他处理，每次加载一话时内存会增加几MB至十几MB，感觉优化不太好，官方文档对此说明也几乎为0，所以自己再做了这个一个实现，具体效果对比没测（懒_啦）。
另外：有的漫画小程序是这么处