likes
comments
collection
share

重磅上新 | 掌握跨端开发,提升核心竞争力!

作者站长头像
站长
· 阅读数 19

截止 2022 年末,互联网 小程序 总数超过 780 万, DAU 更是突破了 8 亿。

小程序的成功有很多方面的原因。首先,小程序相比 Native 更轻量,速度更快,无需下载;其次,小程序成本非常低,原来一个应用需要开发 iOS 和 Android 双端,现在只用小程序开发就可以了,大幅缩减了成本;最后,小程序可以依赖于平台和社区推广,更受用户青睐。

随着小程序的快速发展,以小程序、 React Native、Flutter 为代表的跨端技术,逐渐成了前端开发者的必备技能。在就业市场并不乐观的当下,进阶大前端开发,精通跨端技术,已然成为前端开发者的又一“破局之选”。

一些大前端工程师的招聘中也会明确要求开发者精通移动端开发:

  • 有 React Native 或小程序开发经验
  • 具备跨端框架实践经验并充分了解技术原理
  • 熟悉主流跨端 Flutter、RN、Chromium 等工作原理和源码
  • ……

重磅上新 | 掌握跨端开发,提升核心竞争力!重磅上新 | 掌握跨端开发,提升核心竞争力!

相比于传统的 Web 应用,小程序的功能和设计更加轻量,但是它的复杂程度一点都不亚于 Web 应用:

  • 双线程模型导致小程序相比传统 Web 有着更复杂的渲染和通信设计;

  • 多页面栈模型促使小程序应用比传统单页面 SPA 应用,更需要开发者有良好的架构设计能力;

  • 小程序受包体积限制

  • ……

重磅上新 | 掌握跨端开发,提升核心竞争力!

精通跨端技术,进阶大前端

本小册围绕大前端开发者必须掌握的跨端技术知识展开,包括移动端的 WebView 和 H5、小程序、React Native 、Taro 以及用 DSL 做的跨端技术栈。总的来说,小册主要包含四大模块。

WebView 模块

无论是大型的 App 应用中内嵌的 H5 页面,还是微信、支付宝等等 小程序 ,其本质都是 WebView 。因此,学习跨端开发的第一步, 就是要知道 WebView 是如何设计和通信的。

这部分我们会讲解 WebView 是如何设计的,WebView 页面在移动端的形态,以及 WebView 是如何通过 Native 打开的,又是如何和 Native 通信的。其中,会重点介绍 JS 和 Native 的通信方式:JSBridge,最后实现一个 JSBridge。

小程序模块

在小程序开发中,最需要关注的就是性能。想要保障小程序的性能,我们就要深入小程序的底层原理。因此,这一模块会全方位介绍小程序, 从基础使用到运转原理,再到架构设计,最后结合大型应用实践,给出可落地的执行方案,带你彻底掌握小程序开发。具体包括如下几个部分:

  • 颗粒化更新方案:针对大型应用频繁更新的场景,多页面多维度如何更新,波及范围越小。

  • 分包治理方案:多个团队间如何做到小程序分包治理,保证每个团队不互相影响。

  • 异常监控方案:小程序的监控和异常处理、降级手段,如何做一个实时监控。

  • 高性能长列表方案:小程序中有很多无限滚动的场景,如何开发长列表,防止元素越来越多,保障性能。

  • 设计模式:常用的组件设计模式以及具体的应用落地案例设计模式,如何提高小程序代码的复用性和可维护性,降低开发成本,提高生产力。

重磅上新 | 掌握跨端开发,提升核心竞争力!

React Native 模块

讲完 WebView 渲染模式的小程序和 H5,就到了另外一种 Native 渲染模式 React Native。这一模块,将围绕真实的场景,讲解 RN 在大型项目中的应用实践、解决方案,包括:

  • 利用 RN 的原生交互能力,与 React Hooks 实践结合。

  • 因为渲染模式的不同,导致 RN 中的优化手段也和浏览器有差异,如何打造高性能的 RN 应用。

  • 以 React Native 运行时的通信流程和渲染流程作为切入点,探索 RN 内部的运转机制。

  • 理解 RN 中的设计模式,自如开发 RN 应用。

多端复用

多端复用,也就是一套代码在多端运行, 已经成为移动端跨端开发的新趋势。比如跨端开发的开源项目 Taro,可以通过编译时运行时的方式实现一套代码运行在小程序、iOS、 Android 和 Web 应用上,而且在不同平台上的渲染模式不一样,比如在小程序和 Web 应用上是用 WebView 渲染,在 Native 应用中是采用 Native 渲染一样。

这一模块,我们会以跨端开发的开源项目 Taro 为例,深入介绍其背后运转的原理及实践,探讨多端复用的本质, 并介绍目前主流的动态化多端复用方案DSL。目前很多大厂都有自研的跨端框架,这些框架以前端框架模版作为 DSL 。最后会带大家从 0 到 1 设计实现一个 DSL 核心功能,来还原整个 DSL 的实现流程,包括内部运转的原理和细节。

温馨提示

最后的最后,这本小册和「外星人」的上一本 React 小册一样,会保持持续更新。这里预告一下,正文的 31 节更新完,「外星人」会结合前面讲解的理论知识,再出一个业务项目。理论学习+实战训练结合的方式,助力大家更好地掌握跨端开发!

早鸟特惠+多重惊喜等你来~

💰 现在购买,享受早鸟特惠,限时¥35.94

↓↓↓点击下方图片或扫描二维码,立即试读↓↓↓