跨端技术概述|青训营笔记

84 阅读3分钟

这是我参与「第五届青训营 」伴学笔记创作活动的第9天

概述

本节课程内容会分为以下几个方面:

  • 跨端是什么,给大家介绍跨端产生的背景及解决的问题
  • 跨端技术方案介绍,给大家介绍目前主流的跨端技术方案(hybrid 方案/原生渲染方案/自渲染方案/小程序方案)以及对比
  • 基于小程序跨端实践,带大家了解如何开发一个小程序以及优化小程序
  • 总结与展望

课前

  1. 了解一门前端开发框架(React/Vue), reactjs.org/, vuejs.org/
  2. 了解 React Native, reactnative.dev/
  3. 了解 Flutter, flutter.dev/
  4. 了解抖音小程序,developer.open-douyin.com/docs/resour…
  5. 了解前端和客户端通信原理

TypeScript 介绍

TypeScript 是 JavaScript 的超集,提供了 JavaScript 的所有功能,并提供了可选的静态类型、Mixin、类、接口和泛型等特性。 TypeScript 的目标是通过其类型系统帮助及早发现错误并提高 JavaScript 开发效率。 通过 TypeScript 编译器或 Babel 转码器转译为 JavaScript 代码,可运行在任何浏览器,任何操作系统。 任何现有的 JavaScript 程序都可以运行在 TypeScript 环境中,并只对其中的 TypeScript 代码进行编译。 在完整保留 JavaScript 运行时行为的基础上,通过引入静态类型定义来提高代码的可维护性,减少可能出现的 bug。 永远不会改变 JavaScript 代码的运行时行为,例如数字除以零等于 Infinity。这意味着,如果将代码从 JavaScript 迁移到 TypeScript ,即使 TypeScript 认为代码有类型错误,也可以保证以相同的方式运行。 对 JavaScript 类型进行了扩展,增加了例如 any、unknown、never、void。 一旦 TypeScript 的编译器完成了检查代码的工作,它就会 擦除 类型以生成最终的“已编译”代码。这意味着一旦代码被编译,生成的普通 JS 代码便没有类型信息。这也意味着 TypeScript 绝不会根据它推断的类型更改程序的 行为。最重要的是,尽管可能会在编译过程中看到类型错误,但类型系统自身与程序如何运行无关。 在较大型的项目中,可以在单独的文件 tsconfig.json 中声明 TypeScript 编译器的配置,并细化地调整其工作方式、严格程度、以及将编译后的文件存储在何处。

课后

  1. 跨端解决了什么问题?
  2. 常见的跨端技术方案有哪些?各方案的技术原理是什么?他们之间有什么区别?
  3. 跨端技术方案中有哪几个核心部分?
  4. 抖音开发者工具提供了哪些能力?
  5. 抖音小程序开发与 web 开发有哪些异同?
  6. 小程序性能优化会关注哪些性能指标?分为哪几个方向进行性能优化?可以使用哪些工具来提升效率?
  7. 小程序 setData 如何优化?