[Web前端] WEEX、React-Native开发App心得 (转载)

转自: https://www.jianshu.com/p/139c5074ae5d

2018 JS状态报告: https://2018.stateofjs.com/mobile-and-desktop/react-native/

WEEX、React-Native开发App心得

起因

最近公司准备使用weex或者react-native进行跨平台开发,并不是要做新的app而是准备用这种方式代替原来webview+h5内嵌这种方式,这种hybrid的方式,存在于上古年代了,性能堪忧,还要适配安卓端复杂设备种类,各主流电商的webview,虽然在前一段时间,安卓统一使用了传说微信、qq都在使用x5-webview,但是效果并不是很明显,腾讯浏览服务是要做到统一安卓端的webview,但是腾讯的x5的条件是,该安卓手机已经安装了腾讯x5浏览器,换句话说就是,你的安卓手机上面,至少要有微信、qq、qq浏览器等之一的拥有腾讯浏览内核的产品,虽说覆盖面很广。但是,考虑到我们公司的用户大部分年龄比较大,可能相比较而言覆盖范围就不那么广,收到投诉的也会比较多,毕竟我们跟他们的沟通成本也比较高;
直接集成腾讯x5内核的话也存在诸多问题;所以还是需要一条跨平台之路;

分析

纵观现在主流开源的跨平台之路,有两条:一条是由facebook开源的基于reactJs的react-native;另外一条是由alibaba开源的可以说是基于VueJs的Vue-native,不不不,口误,是WEEX;那么我们分析一下应该如何选型呢,我刚开始也是看了无数的评论,怎么说的都有;一般分为两类,一类是切身体验过从搭建到开过程的这类评论会比较有营养,不过会看不太懂;另外一类,就是无脑喷阿里开源,我感觉这类评论代入感也比较强,各种举例、论证,有理有据而且通常恢复数量被点赞数量也比较高,说什么,“kpi产物”、“阿里自己都不用啊”、“文档仨月都不更新一次啊”、“刚出来赶紧找的靠谱的接盘”、“手淘、天猫都是用的rn啊”;我不敢想,可是仔细一想,还真是这么回事儿;
总之各大论坛贴吧逛完一遍,你绝对不想用weex了;我这么一看不行啊,毕竟要看看两种方法那种更适合,所以,我跟大家想的一样,首先选了WEEX;

WEEX的上手体验

真的是不用不知道,一用吓一跳,我是在windows环境下进行开发的,我可以很负责任的说,按照weex官方提供的文档在windows下直接搭建开发环境很难一次点亮;很嘲讽啊,文档也是一如既往的烂啊,好多应该比较细节的东西,文档上面往往是认为你是大神,或者说你个屌丝用个windows本还想搞weex?经过一番又一番的折磨,我终于看不下去了,这个文档光看就很晕,很想吐,还是github上找几个案例直接试一下,案例还是很好的,多数的都是使用weex构建一个新的跨平台应用,启用大面积使用了vue的语法,开发起来确实也是很简单;看完demo之后,回过头来再看weex文档,好像觉得文档看着还不错,虽然简单了点儿,好像该说的也都说了,没毛病;于是可以自己动手试一下了,在这里weex面向的主要是广大的web前端开发者,精简的使用方式,路由的配置,weexpack的使用调试方式页更适合web开发者们使用;weex基本上提供了两种使用方式,一种是从零开始开发一个跨平台的app,另外一项中是集成到现有的app当中,原理基本是weex经过编译会生成两个bundle.js一个是供web端使用的,另外一个是提供给安卓、ios使用的;毕竟是号称,write once, run everywhere;weex引入了vue runtime js,先不说web端的实现这个应该去直接看vue会更好,直接说native端的实现,js作为连接原生控件与视图层的纽带,代替了以往使用java,oc,swift直接调用原生控件,这样生成的ui层依旧是原生的,和html毫无关系的,至于哪些div,image只不过是名字和html标签一样的组件而已,也没有了dom对象的存在,因为实际的开发环境不是浏览器而是基于原生,所以jquery以及它的一些插件是用不了的,大家一定要明确这一点,无论weex还是react-native的实际开发的对象都不是浏览器了,所以,我们不要把平时在浏览器是开发用到的东西都带进来,所以浏览器中那些标签在weex或者react-native中也就没有任何的意义;明确这一点之后,我们就可以进行开发了,遇到的一些坑往这个方向靠基本也就容易解决了。吐槽一下weex的错误提示真的是不行;

react-native上手体验

react-native高大上的facebook开源,让人诟病的BSD +专利许可证,虽然react已经切换到mit但是react-native仍旧是BSD +专利许可证;这一点使大家在开发之前一定要注意的。
react-native的开发,我不想多说什么,说多了没有用,不如直接看文档,毕竟文档美如画、上手体验快如狗。社区、视频、教程也多如牛毛,就不一一列举,唯一建议的一点就是要想深度使用react-native请熟读并背诵reactJs以及redux相关文档谢谢;了解些需原生开发,或者说原生开发者们更适合使用react-native;真的原生开发用了react-native都是爱不释手;关于集成到现有应用貌似不如weex;毕竟人家weex就是指着这个技能活着的;写几个页面这种工作就交给weex吧;

总结

如果你现在想要从头开发一款app,那么我可以很负责任的向你推荐react-native,很好用,文档很全,你要填的坑,别人基本都给你准备好土了;如果你是想我们公司的需求一样,只是想干掉hybrid,那么weex绝对是不二之选,首先,weex够简单,web开发者就可以先胜任;其次,不需要安装复杂的环境,运行环境简洁、调试工具也还好,容易做降级处理,特别适合开发单个页面;

最近WEEX官网也发生了巨大的变化,英文文档也相当的全面,部分的英文文档还没有全面翻译成为中文,还要些日子,完全可以胜任生产中一些简单的场景、但是依旧不建议开发完整app的开发者使用,还有很多值得考量的地方,坑,还是多;

2018/08/01

在使用weex完成一个完整的app的之后,我们觉得weex提供给我们的更多的是一种解决方案,我们仍需要投入资源与成本到学习和开发中,所以,综观前端技术百花齐放,找到一条适合的路很重要;或者说当我们找不到非常适合的方案的时候,采用局部最优解,直到整个项目完成,它不一定是最好的方案,但往往是行之有效的。

2018/08/21

距airbnb宣布放弃使用react-native,回归原生技术,已经有两个月了,airbnb对rn的贡献,众所周知,虽然airbnb回答的很委婉,但是暴露出的问题还是很明显的,到底有没有必要走这条跨平台之路,项目规模的大小对跨平台的影响,以及体验,后期的维护,版本的迭代,版本的发布,处理安卓ios之间的差异,以及airbnb在博客中提到的致命的问题,即,"Airbnb 放弃使用 React Native 的主要原因是 React Native 未能实现完全的跨平台抽象,有时候仍然需要针对特定平台单独编写代码来解决问题。这就间接要求他们的工程师必须熟悉三个平台才能真正用好 React Native,然而绝大多数开发者只熟悉一两个平台,久而久之便引发了一系列的问题",这些问题我们就真的都能解决嘛。这不禁会引发我们对跨平台之路的重新思考,这一步走出去,回头也是需要很大的勇气的。

2019/01/28

据春节放假还有6个工作日,这里有一份来自权威网站的报告,大家查收一下,以便于了解一下React Native的现状,总的来讲RN在国外依旧很火,但是实在是不太适合承载大型应用,这也是很多公司从rn中迁移的原因之一,报告地址:https://2018.stateofjs.com/mobile-and-desktop/react-native/

2019/02/14

一度消声灭迹的Dart再放大招,随着Dart 2.1.0稳定版本的发布,和Flutter1.0的加持,Dart再度唤醒了广大前端、后端开发者以及客户端开发者对跨平台的热忱。谷歌一直秉着的‘一统江湖’的战略从来没有停过,从浏览器到 OS 再到 go语言 的成功。我们可以预见得到,未来的3-5年内Dart以及Flutter所能取得的成绩。

posted @ 2019-08-05 18:30  demoblog  阅读(733)  评论(0编辑  收藏  举报