共计 2470 个字符，预计需要花费 7 分钟才能阅读完成。
前端和原生之间的桥梁 JavaScriptCore 为原生编程语言 Objective-C、Swift 提供调用 JavaScript 程序的动静能力，还能为 JavaScript 提供原生能力来补救前端所缺能力。
JavaScriptCore 框架次要由 JSVirtualMachine、JSContext、JSValue 类组成。
支流的跨端计划，次要分为两种：一种是，将 JavaScriptCore 引擎当作虚拟机的计划，代表框架是 React Native；另一种是，应用非 JavaScriptCore 虚拟机的计划，代表框架是 Flutter。
一、flutter 和 react 的区别
应用跨端计划进行开发，必然会代替原有平台的开发技术，所以咱们在抉择跨端计划时，不能只依赖于某几项指标，比方编程语言、性能、技术架构等，来判断是否适宜本人团队和产品，更多的还要思考开发效率、社区反对、构建公布、DevOps、CI 反对等工程化方面的指标。所以说，咱们在做出抉择时，既要着眼于团队现状和所选计划生态，还要思考技术将来的倒退走向。
React Native 所应用的 JavaScriptCore，本来用在浏览器中，用于解释执行网页中的 JavaScript 代码。为了兼容 Web 规范留下的历史包袱，无奈专门针对挪动端进行性能优化。Flutter 却不一样。它一开始就摈弃了历史包袱，应用全新的 Dart 语言编写，同时反对 AOT 和 JIT 两种编译形式，而没有采纳 HTML/CSS/JavaScript 组合形式开发，在执行效率上显著高于 JavaScriptCore。除了编程语言的虚拟机，Flutter 的劣势还体现在 UI 框架的实现上。它重写了 UI 框架，从 UI 控件到渲染，全副从新实现了，依赖 Skia 图形库和零碎图形绘制相干的接口，保障了不同平台上能有雷同的体验。
凭借热重载（Hot Reload）这种极速调试技术，极大地晋升了开发效率，因而 Flutter 吸引了大量开发者的眼球。同时，Flutter 因为从新实现了 UI 框架，能够不依赖 iOS 和 Android 平台的原生控件，所以无需专门去解决平台差别，在开发体验上实现了真正的对立。
如果谷歌的新零碎 Fuchsia 可能如谷歌所打算的五年之内利用到挪动端的话，那么五年后即便应用 Fuchsia 的用户只有 10%，你的 App 也要去反对 Fuchsia。Fuchsia 零碎的最上层就是 Flutter，这时应用 Flutter 来开发 App 就成了首选。而 Flutter 自身就是一种跨端计划，一旦应用 Flutter 开
Flutter 界面是由 Widget 组成的，所有 Widget 组成 Widget Tree，界面更新时会更新 Widget Tree，而后再更新 Element Tree，最初更新 RenderObject Tree。接下来的渲染流程，Flutter 渲染在 Framework 层会有 Build、Wiget Tree、Element Tree、RenderObject Tree、Layout、Paint、Composited Layer 等几个阶段。将 Layer 进行组合，生成纹理，应用 OpenGL 的接口向 GPU 提交渲染内容进行光栅化与合成，是在 Flutter 的 C++ 层，应用的是 Skia 库。包含提交到 GPU 过程后，合成计算，显示屏幕的过程和 iOS 原生根本是相似的，因而性能也差不多。Flutter 的次要劣势，在于它可能同时运行于 Android 和 iOS 这两个平台。然而，苹果公司在 WWDC 2019 上推出 SwiftUI 和 Preview 后，Flutter 在界面编写和 Hot Reload 上的劣势会逐步升高。发成为团队的必选项，那么其余技术栈就没有存在的价值了。其实，我自己还是很看好 Fuchsia 零碎的。它的内核是 Zircon，Fuchsia 是整个零碎的统称，在 Fuchsia 技术的抉择上，谷歌抉择了微内核、优于 OpenGL 高内核低开销的图像接口 Vulkan、3D 桌面渲染 Scenic、Flutter 开发框架。谷歌的打算是，三年外在一些非主流的设施上对 Fuchsia 内核进行欠缺，待成熟后推向挪动端。Fuchsia 架构分为四层，包含微内核的第一层 Zircon，提供零碎服务的第二层 Garnet，用户体验基础设施的第三层 Peridot，Flutter 所在根底应⽤的第四层 Topaz。联合 Android 零碎的教训，在设计架构之初，谷歌就思考了厂商对深度定制的诉求，使得每层都能够进行替换，模块化做得比 Android 零碎更加彻底。
Flutter 界面是由 Widget 组成的，所有 Widget 组成 Widget Tree，界面更新时会更新 Widget Tree，而后再更新 Element Tree，最初更新 RenderObject Tree。接下来的渲染流程，Flutter 渲染在 Framework 层会有 Build、Wiget Tree、Element Tree、RenderObject Tree、Layout、Paint、Composited Layer 等几个阶段。将 Layer 进行组合，生成纹理，应用 OpenGL 的接口向 GPU 提交渲染内容进行光栅化与合成，是在 Flutter 的 C++ 层，应用的是 Skia 库。包含提交到 GPU 过程后，合成计算，显示屏幕的过程和 iOS 原生根本是相似的，因而性能也差不多。Flutter 的次要劣势，在于它可能同时运行于 Android 和 iOS 这两个平台。
以上参考链接：https://time.geekbang.org/col…
申明式范例
在“申明式”的范例中用户界面被“申明”为示意它的一些数据的函数，这些数据被称为状态。随着这些状态发生变化，UI 会自动更新。举个例子来说：如果用户还没有登录，那就显示登录界面；如果用户曾经登录就显示用户主页；如果网络忙碌则显示旋转期待动画；如果失败则显示谬误。与命令式办法的不同之处在于，所有不同的状态都在一个中央对立解决，这样就能避免意外或不统一的后果。
申明式范例往往有很多益处，比方：大大降低了复杂性；须要的代码更少；进步了代码品质；缩短开发工夫。