写在开头：本文不涉及任何代码，只是概念层面的。结合我在实际开发过程中的各种经验，对这些跨平台技术进行了分析跨平台技术的起源点评：传统的纯原生开发已经不能满足日益增长的业务需求。主要表现在以下两个方面。1）对动态内容的需求在增加。当需求发生变化时，纯原生应用需要通过版本升级来更新内容，但应用发布和审核需要一个周期，这对于瞬息万变的互联网时代来说是难以接受的。因此，动态应用（需要更新应用内容而不发布版本）变得迫在眉睫。2）业务需求变化快，开发成本增加。由于原生开发一般需要Android和iOS两个开发团队的维护，在版本迭代时，无论是人力成本还是测试成本都会增加。综上所述，纯原生开发主要面临动态化和开发成本两个问题，针对这两个问题，一些跨平台的动态框架应运而生。跨平台技术简介对于原生开发所面临的问题，人们一直在努力寻找好的解决方案。不过，今天已经有很多跨平台的框架（注意，本书所指的“跨平台”并没有特别说明，特指Android和iOS这两个平台），根据其原理，主要可分为以下三类。1）H5（HTML5）+原生（Cordova、Tonic、微信小程序）。2）Javascript开发+原生渲染（ReactNative、Wex、快应用）。3）自绘U+原生（QTMobile、Flutter）。下面我们就来一一了解这三类框架的原理和优缺点。1.12Hybrid技术介绍H5+原生混合开发框架的主要原理是通过H5实现APP需要动态变化的部分内容，通过原生网页加载控件Webview（Android）或WKWebview加载(iOS)（如无特别说明，本书将使用Webview统一指代Android和iOs中的网页加载控件）。这样H5部分可以随时更改，无需发布版本，满足动态要求；同时，由于H5代码只需要开发一次，可以同时在Android和OS平台上正常运行，也可以降低开发成本。也就是说，H5部分功能越多，开发成本越小。我们称这种H5+原生开发模式为混合开发。对于以混合模式开发的APP，我们称之为混合应用或HybridAPP。如果一个应用程序的大部分功能都是使用H5实现的，我们就称它为Web应用程序。应用程序。当前混合开发框架的典型代表有Cordova、Ionic、微信小程序。值得一提的是，微信小程序目前是在Webview中渲染的。不是本机渲染，但可能在未来。混合开发技术要点前面提到，原生开发可以访问平台的所有功能，而在混合开发中，H5代码运行在WebVicw中，Webview本质上是浏览器内核，其脚本仍然运行在权限受限的沙箱中，大部分系统能力是无法访问的，比如无法访问文件系统，无法使用蓝牙等，因此H5中无法实现的功能需要原生实现。混合框架一般会在原生代码中预先实现一些访问系统能力的API，然后暴露给Webview供Javascript调用。这样Webview就成为了Javascript和原生AP之间的通信桥梁，主要负责Javascript和原生AP之间的通信。调用间的消息传输，消息传输必须遵守一个标准的协议，规定了消息的格式和含义，我们将依赖Webview进行Javascript和native的通信，并实现一定的消息传输协议，这个工具称为WebviewJavascriptBridge，简称Jsbridge，也是混合开发框架的核心。我使用的跨平台技术：ElectronReact-NativeTaroCordova快速应用Flutter（刚学）...从上到下排名，除了Flutter我没用过Electron在商业项目中的核心：Electron封装了Node.js运行环境和GoogleChrome内核结合在一起，因此具有Node.js的集成能力。平台。Mac、Windows、Linux。工具类软件是最复杂的，比如vscode、word，极其复杂，而且由于可以调用addons、各种脚本插件、原生第三方插件，这个技术简直就是黑科技，到此为止不敢说熟悉。但是，APPStore已经无法启动Electron应用，打包签名服务器经常挂掉。特别注意：Electron开发的东西是软件，是安装在电脑上的软件！我的GitHub可能有你想要的Demo内容：https://github.com/JinJieTan如果你想把Electron开发好，你必须有一个专门写插件的C++人，和一个后端出身的运营人sqlite数据库（数据库升级虽然可以兼容老版本，但是如果复杂的应用设计不好，数据库就完蛋了），懂前后端，熟悉调用操作的全栈工程师系统插件可以对其进行开发，从而可以容纳复杂的应用程序。如果你说这太浪费了，那我觉得你从来没有开发过复杂的软件。一个好的软件（客户端），必须要考虑程序反编译（保护）、崩溃守护进程异常收集、用户自动升级等问题。（差分或全）、本地数据库加密、通信、激活和唤醒。...太多了，但是前端大部分都是后台管理系统，也是悲剧。..我像以前一样做过采访来制造火箭。把微信和QQ里的一些插件拿出来，经过一些处理，在项目中使用。至此，一个新的世界已经打开。总之，Electron是考验技术的，是晋升伪全栈工程师最快的途径。推荐学习指数：五星级React-native去年Airbnb将APP技术从RN改回native。首先，它是一家外企。从某种程度上来说，使用RN会比国内有更大的优势，获得更大的收益。支持。就像你用Taro，然后你可能会在论坛上找到它的负责人，提出你想要的支持，最后它真的支持（这个存在，如果你想知道你可以帮助你联系，我也是建议人我身边用太郎）回到正题：RN死了吗？JQuery没有死，它会死吗？当然不是！RN的生态非常强大，也是由它开发的真正的原生应用。它的原理是这样的：在React-native文件中编写的代码会在内存中生成一个虚拟DOM对象（实际上是一个JS对象），然后通过javaScriptCore（IOS自带，Android是）映射到一个native控件树不是，所以RN打包后，安卓的包比苹果的大）。很多jsBridges都是基于javaScriptCore实现的。例如：iOS代码发送通知：//需要包含的头文件#import#import[self.bridge.eventDispatchersendAppEventWithName:@"EventNotification"body:@{@"姓名":@"nnnnnnnn"}];接收通知的RN代码：//为接收到的通知创建一个监听器，需要组件NativeAppEventEmittervarlistener=NativeAppEventEmitter.addListener('EventNotification',//监听的Notificationname(reminder)=>console.log(reminder.name,'收到通知'));提醒：跨平台并不是一门高深的技术，只要了解它的运行机制，就很容易开发和定位问题。那么RN有什么缺点呢？比如频繁的setState可能会造成卡顿（做动画容易掉帧，尤其是性能不好的手机），但是也可以通过一些技术优化来避免。跟谁写的有很大关系，还有项目变得很大，跟原来的交互很多，特别复杂的应用，跨平台兼容遇到的问题会越来越多。这就是为什么Airbnb会切换回原来的。维修确实比较麻烦。版本环境有问题，升级后有可能无法启动。..推荐理由：开发速度快，生态成熟，使用React的JSX语法和FLex布局快速开发原生应用，推荐学习指数：四星太郎小程序跨平台开发，可以用TSX、JSX、和React语法框架内置了一些UI组件，还有素材市场，目前势头非常好。还可以集成React-native，真正做到一套代码多处运行。不仅可以编译成各种平台小程序，还可以是RN~666的一个应用，还支持快应用https://taro.aotu.io/现在市面上端端形式多样、Web、React-Native、微信小程序等各种端流行。当业务需求同时需要不同端的性能时，为不同端编写多套代码。成本显然非常高。这个时候，只用一套代码就可以适配多种终端的能力就显得极为必要了。使用Taro，我们可以只写一套代码，然后使用Taro的编译工具分别编译源码，可以在不同的终端使用（微信/百度/支付宝/字节跳动/QQ/京东小程序，快应用，H5、React-Native等）运行代码。没看过Taro的源码，不过我觉得里面用了很多他们写的babel包。应该是JIT模式，加一个中间层，把你写的东西编译成小程序可以执行的代码。个人觉得小程序不要太复杂，不然还不如做个APP，轻量级跨平台，自然是最快的，而且可以用TSX语法，React，很棒。推荐指数：五颗星Cordova是一个比较老的技术，但是我现在的公司用了6个多，也搭建了一套工业系统。我觉得也挺好的。是一种比较传统的跨平台技术。类似于小程序，在webView中渲染，原理如下：其实是原生webView加载执行H5代码，这样就可以跨平台，发布的内容可以随时更新。这就是传统的hybridAPP（混合开发）也有webApp，直接用h5技术打包成APP。体验肯定不如原来的，因为调用webView需要几百毫秒，但是也可以通过一些技术优化，跟谁写的有很大关系。快应用是华为、小米等国内厂商为了和小程序竞争而做的，比如RN的这些框架内置了一些渲染/排版引擎，所以提交包比较大。快应用集成在安卓手机的ROM中，所以只有源代码部分，安装体积比较小。这叫快应用。快应用采用原生js开发，框架和原生微信小程序很像（写起来难受，太郎支持快应用）Tips：写快应用工资很高，感觉基本在30K以上（可能是错觉)FlutterFlutter是ogle推出的开源移动应用开发框架，主要特点是跨平台、高保真、有一定的性能。开发者可以通过Dar语言开发APP，一套代码可以同时运行在OS和Android平台上。Flutter提供了丰富的组件和接口，开发者可以快速为Flutter添加Native扩展。同时，Flutter还可以使用Native引擎来渲染视图，这无疑会为用户提供良好的体验。跨平台的自绘引擎Flutter不同于大多数其他用于构建移动应用程序的框架，因为Flutter既不使用Webview，也不使用操作系统的原生控件。相反，Flutter使用自己的高性能渲染引擎来绘制小部件。这样既可以保证Android和iOS上UI的一致性，又可以避免依赖原生控件带来的局限性和高昂的维护成本。Flutter使用ska作为其2D渲染引擎。Skia是Google的一个二维图形处理函数库，包括字形、坐标变换、位图，具有高性能和简洁的性能。Skia是跨平台的，它还提供了非常友好的API，目前GoogleChrome和Android都使用Skia作为它们的绘图引擎。目前，Flutter默认支持iOS、Android、Fuchsia（谷歌全新自研操作系统）三种移动平台。不过Flutter也可以支持Web开发（FlutterforWeb）和PC开发。Flutter的高性能主要有两点保证。首先，FlutterAPP是用Dart语言开发的。在JT（即时编译）模式下，Dart基本上和Javascript一样快。同时，Dar还支持AOT。在AOT模式下运行时，Javascript会远远落后。速度的提升对于高帧率下的视图数据计算非常有帮助。其次，Flutter1使用自己的渲染引擎来绘制UI，布局数据由Dan语言直接控制，因此在布局过程中不需要像RN那样在Javascript和Native之间进行通信。这在一些滑动和拖动的场景下优势很明显，因为滑动和拖动的过程中经常会引起布局的变化，所以Javascript需要和Native保持同步布局信息，这与浏览器中的Javascript不同。频繁操作DOM带来的问题是一样的，都会带来相当大的性能开销。重点：Flutter自带渲染引擎，通过中间层通信避免了上述跨平台技术带来的性能开销，但还是避免不了写native代码，GitHub上还有很多issue，但小小编已经入坑了，就学最后一个吧，以后不学前端了。Dart语言的学习也需要一定的成本。如果公司有这个安排，可以入坑试试以上五种。不同的业务场景有相同的技术场景，技术为产品服务，跨平台的出现不是为了扼杀原创，而是为了更好更高效的开发
