逐渐抹平小程序与web开发体验-变化吧

2020年3月10日20:57:21前端框架评论阅读模式

以往一周一件事危害最刻骨铭心的是一套编码开发设计好几个服务平台的微信小程序。现阶段大型厂基础常有自身的微信小程序「寄主自然环境」，在其中以手机微信为先。接着，阿里巴巴、百度搜索、今日头条都竞相发布了她们自身的微信小程序。这就引起了一个难题，那么多微信小程序平台，难道开发者要开发多套代码吗？

答案肯定不是！

小程序终究属于前端范畴，毕竟它的技术栈与前端技术栈大同小异。前端发展这么多年，Vue、React 框架被应用到无数网站，这已经不是 jQuery 的时代了。受这些框架的影响，小程序的开发体验也被提上了日程。

小程序框架出现了。

小程序框架的出现使得开发者通过一套代码可以开发多个平台的小程序，同时把前端高效的开发体验也加进来了，比如支持 CSS 预处理器、状态管理、Typescript 语言。框架对外宣称提供类 Vue 的开发体验。那这些框架的原理是什么？

小程序虽然没有一个统一的标准，但是各个小程序平台默认都以「微信小程序为标准」，谁不以微信小程序为标准，谁或许将成为开发者眼中的“IE浏览器”。所以各个小程序平台给开发者提供的 API 基本都是“抄”自微信小程序，但是各家小程序都有自己的独特符号，比如百度智能小程序是 swan、微信小程序是 wx、支付宝小程序是 ant、头条小程序是 tt。

在小程序的「宿主环境」中只能识别自己的规范，开发者必须遵循。小程序框架能做的就是通过某种技术对代码进行转换，使得其能符合不同「宿主环境」。一图胜千言：

逐渐抹平小程序与web开发体验

说白了，小程序框架做的事情就是让开发者通过一种新的规范来开发小程序，小程序通过编译，最终转换成不同平台的代码。

这周我接触到的是百度的小程序框架 OKAM，一套代码可以同时支持多种小程序，同时也支持快应用。功能特性（来做OKAM官方描述）：

1、开发模式
支持单文件组件化开发方式，目录结构更加清晰简洁；
支持 NPM 包的依赖管理和引用；
提供渐进增强可配置方式，包括可配置的构建流程，来提升开发框架能力；

2、开发语法
模板：支持类 Vue 模板语法、Pug 模板语法；
样式：支持 CSS 预处理器和后处理器， Stylus、Less、Sass、Postcss；
脚本：支持 Typescript、ES Next 语法支持；

3、HTML 标签支持
Vue 数据操作语法，包括 computed、watch 支持；
Vue 双向绑定 v-model 指令支持；
filter 模板语法支持；
Redux 数据状态管理；
模板组件 ref 引用支持；
Mixins 支持；
Promise、Async、await 语法支持；
原生接口支持可定制的 Promise 化；
提供原生接口 Hook 能力；
样式 rpx 单位自动转换；
接口 Mock；
图片自动压缩能力；

小程序开发逐步抹平与 web 的差异，还有很多框架，大家自行搜索：

1、京东的 taro：多端统一开发框架，支持用 React 的开发方式编写一次代码，生成能运行在微信/百度/支付宝/字节跳动/ QQ 小程序/快应用/H5/React Native 等的应用；
2、Chameleon：真正专注于让一套代码运行多端的开发框架，提供标准的MVVM架构开发模式统一各类终端；
3、uni-app：使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、H5、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉）等多个平台。

小程序端的发展历程和浏览器当年的发展历程有很多相似之处。

本文来源于：逐渐抹平小程序与web开发体验-变化吧门户
特别声明：以上文章内容仅代表作者本人观点，不代表变化吧门户观点或立场。如有关于作品内容、版权或其它问题请于作品发表后的30日内与变化吧联系。