初见
1.小程序产品定位
用完即走,触手可及。
轻量、突出重点,快速直达用户的核心需求。
优秀的操作体验。
2.小程序组成
作为开发者来说,小程序需要WXML、WXSS和JS三部分。WXML和WXSS组成了view层,负责view层的渲染。JS组成了manager层,JS负责整个小程序的逻辑部分。
3.小程序架构
WXML和WXSS负责配置部分,小程序的view层其实还是Web view的形式。Manger是在app service的部分。
页面可以通过JSbridge和app service进行交互,也可以调用一些native组件。
Manager也是通过JSbridge,额外有一个单独封装的API,就可以直接通过API调用native组件。
4.小程序native组件
小程序的实现方式是通过小程序JSbridge的API,获取原来Web组件的信息,在Webview上盖了一层native的组件。
小程序里具有native能力的组件大概有canvas、video、input、textarea、map和picker。这几个组件在小程序里是以native的形式展现出来。
5.与Web端的区别
优点:
小程序具有native的能力,有扫码、离线、地图之类的功能。
它接近原生应用的用户体验。
它是类似Web的开发语言,入门门槛低。
提供大量常用组件,开发成本低。
自带ES6支持。
限制:
无法访问到真实的DOM节点。
无法绑定原生事件。
6.京东购物小程序
技术预研:前期我们做了大量的技术预研。阅读一些官方文档、事例代码,动手编写demo,也让一些同事组织了内部技术分享。
组件开发团队:我们的开发团队前端是四个人,“后台”开发有六个人。
确定结构及分工:
我们把小程序分为page和models、API两部分。
前端主要负责page部分,包括页面重构、数据渲染、用户交互逻辑等等。
Models和API这层是“后台”开发负责的,它们主要负责数据的获取、加工,提供公共的API。
制定开发规范:我们制定了命名规范、接口规范、样式规范、文档规范、文件目录规范和git分支规范。
渡劫
1.手动实现cookie
我们在开发小程序的时候遇到的第一个问题就是运行环境里没有cookie,导致后台接口无法验证登录态。
利用本地存储的能力,在获得网络请求的时候拿到cookie,存到local storage里。下次发网络请求的时候,再从storage里拿出cookie,手动添加到header里,实现了手动cookie的过程。
2.用Nginx进行转发
第二个问题是wx.request的合法域名最多为10个,导致其他域名下的业务请求失败。
因为京东业务分散,域名很多,一个页面需要调用大量API接口,这些API都散落在不同的域名下面。
我们配置了一台nginx,培植了一个新域名专门供小程序进行域名的转发,把需要用到的域名全都映射到新域名的路径里,这样就可以把大量域名合并到一个或几个很小的域名里,成功绕过了限制。
3.使用Websocket
wx.request的并发数不能超过5个,导致并发能力受限,超出限制时请求失败。
传统方式是通过page直接和Server进行交互。有了小程序限制之后,我们在中间加入了WS Server,就可以把请求包装到Websocket里,Websocket再通过转发到Server,Server返回数据后再通过Websocket的形式回到前面的小程序。
4.提前梳理好页面层级关系
提前做好页面层级关系的梳理,保证页面逻辑在5层之内。
5.组件开发模式
小程序只能通过page对象来进行页面内容的修改,加大了UI组件的开发难度。
本文来自电脑杂谈,转载请注明本文网址:
http://www.pc-fly.com/a/jisuanjixue/article-69865-1.html
人家导弹都装在发射筒里真是阿Q精神
日本鬼子几次都是在赌国运而已
2003年军队就已经进驻台湾