当前位置: 首页 > news >正文

Weex 和 React Native的比较

2019独角兽企业重金招聘Python工程师标准>>> hot3.png

Weex 和 React Native的比较

 

写在前面

  • 目前主流的应用大体分成三类:Native App, Web App, Hybrid App. 

1240

三大主流的应用

  • Native App特点:
    • 性能好
    • 完美的用户体验
    • 开发成本高,无法跨平台
    • 升级困难(审核),维护成本高
  • Web App特点:

    • 开发成本低,更新快,版本升级容易,自动升级 
    • 跨平台,Write Once , Run Anywhere
    • 无法调用系统级的API
    • 临时入口,用户留存度低
    • 性能差,体验差,设计受限制
    • 相比Native App,Web App体验中受限于以上5个因素:网络环境,渲染性能,平台特性,受限于浏览器,系统限制。
  • Hybrid App特点:

    • Native App 和 Web App 折中的方案,保留了 Native App 和 Web App 的优点。
    • 但是还是性能差。页面渲染效率低,在Webview中绘制界面,实现动画,资源消耗都比较大,受限于技术,网速等因素

1240

Snip20161028_3.png

  • 为了解决上述问题,一套高效率,高性能的跨平台方案成为了大家热衷的话题,也就有了下面要比较的weex和react native.

基本概念

weex

  • 简介:
    weex是阿里巴巴公司与2016年6月开源的一种用于构建移动跨平台的UI框架
  • 特点:
    • 1.Lightweight:轻量级,语法简单,易于使用
    • 2.Extendable:可扩展,丰富内置组件,可扩展的API,
    • 3.High Performance:高性能
    • 核心理念:
    • Write Once Run Everywhere
    • 基于JS开发框架:
    • weex基于vue.js

React Native

  • 简介:
    • Facebook在2015年3月在F8开发者大会上开源的跨平台UI框架
  • 核心理念:LEARN ONCE, WRITE ANYWHERE
  • 基于JS开发框架:
    • React Native基于React

知识拓展:vue.js和React

Vue:

  • 是一个构建数据驱动的 web 界面的库。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.

React:

  • 基于HTML的前端界面开发正变得越来越复杂,其本质问题基本都可以归结于如何将来自于服务器端或者用户输入的动态数据高效的反映到复杂的用户界面上。而来自Facebook的React框架正是完全面向此问题的一个解决方案,按官网描述,其出发点为:用于开发数据不断变化的大型应用程序。相比传统型的前端开发,React开辟了一个相当另类的途径,实现了前端界面的高效率高性能开发。

Vue.js和React的异同:

Vue和React的区别

Weex和React Native的异同

相同点:

  • 都采用Web的开发模式,使用JS开发;
  • 都可以直接在Chrome中调试JS代码;
  • 都支持跨平台的开发;
  • 都可以实现hot reload,边更新代码边查看效果;

不同点:

JS引擎

什么是JS引擎

学习成本

  • 1.环境配置:
    • ReactNative需要按照文档安装配置很多依赖的工具,相对比较麻烦。 weex安装cli之后就可以使用
  • 2.vue vs react:上面已经做过对比
    • react模板JSX学习使用有一定的成本 vue更接近常用的web开发方式,模板就是普通的html,数据绑定使用mustache风格,样式直接使用css

社区支持

  • Weex开源较晚,互联网上相关资料还比较少,社区规模较小;
  • React Native社区则比较活跃,可以参考的项目和资料也比较丰富

一张图:从渲染时间,内存使用,CPU占用,帧率(图形处理器每秒钟能够刷新几次,高的帧率可以得到更流畅、更逼真的动画。每秒钟帧数 (fps) 愈多,所显示的动作就会愈流畅。)

1240

各种类型应用对比

转载于:https://my.oschina.net/fadoudou/blog/870779

相关文章:

  • 640-802 新版CCNA考试题库下载
  • Kafka部署与代码实例(转)
  • 0-1岁宝宝的游戏和活动指南
  • Oracle性能优化之表压缩及并行提高效率的测试
  • Excel数组排序+图片统一大小
  • composer
  • 不求完美但求易用 报价软件适时出笼(温州传奇4)
  • 微信开源mars源码分析1—上层samples分析
  • 如何让普通域用户可以登录域控
  • jQuery实现AJAX定时局部页面刷新
  • Centos文件查看命令字符
  • ospf实例分析 (子网掩码实战)
  • 欢迎访问我的个人网站
  • 通过串口收发短消息(上)
  • [LeetCode]Reverse Linked List II
  • [译]如何构建服务器端web组件,为何要构建?
  • 2017前端实习生面试总结
  • EventListener原理
  • extjs4学习之配置
  • Fabric架构演变之路
  • JWT究竟是什么呢?
  • laravel5.5 视图共享数据
  • magento 货币换算
  • ReactNative开发常用的三方模块
  • 从PHP迁移至Golang - 基础篇
  • 诡异!React stopPropagation失灵
  • 警报:线上事故之CountDownLatch的威力
  • 目录与文件属性:编写ls
  • 如何打造100亿SDK累计覆盖量的大数据系统
  • 携程小程序初体验
  • 要让cordova项目适配iphoneX + ios11.4,总共要几步?三步
  • 云栖大讲堂Java基础入门(三)- 阿里巴巴Java开发手册介绍
  • 再次简单明了总结flex布局,一看就懂...
  • JavaScript 新语法详解:Class 的私有属性与私有方法 ...
  • 湖北分布式智能数据采集方法有哪些?
  • ​Base64转换成图片,android studio build乱码,找不到okio.ByteString接腾讯人脸识别
  • ​卜东波研究员:高观点下的少儿计算思维
  • ​创新驱动,边缘计算领袖:亚马逊云科技海外服务器服务再进化
  • ​猴子吃桃问题:每天都吃了前一天剩下的一半多一个。
  • #Linux(make工具和makefile文件以及makefile语法)
  • #pragma once
  • $(selector).each()和$.each()的区别
  • (9)STL算法之逆转旋转
  • (Redis使用系列) Springboot 使用redis实现接口幂等性拦截 十一
  • (阿里云万网)-域名注册购买实名流程
  • (第9篇)大数据的的超级应用——数据挖掘-推荐系统
  • (论文阅读32/100)Flowing convnets for human pose estimation in videos
  • (十) 初识 Docker file
  • (四)JPA - JQPL 实现增删改查
  • (四)TensorRT | 基于 GPU 端的 Python 推理
  • (一)C语言之入门:使用Visual Studio Community 2022运行hello world
  • (源码版)2024美国大学生数学建模E题财产保险的可持续模型详解思路+具体代码季节性时序预测SARIMA天气预测建模
  • (转)EXC_BREAKPOINT僵尸错误
  • (转)机器学习的数学基础(1)--Dirichlet分布
  • .bat批处理(十一):替换字符串中包含百分号%的子串