1.0.1 • Published 5 years ago
wodax-umi-mock v1.0.1
wodax
export PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=1 && npx lerna bootstrap
Wodax 是前端开发统一框架 - 支持桌面、传统Web、移动H5、小程序、云开发。
一、运行媒介包括:
- 传统Web浏览器 Chrome, IE, Firefox, Safari
- 移动H5 Android, iOS
- 小程序 微信
- 云 小程序云端
- 桌面应用 基于Electron
二、覆盖两大系统领域
- 企业级后台管理
- 业务应用
核心开发路线
阶段 1:
基于MIT思想及促进发展意义,我们参照了VSCode、Omi、 Umi 三大核心开源代码库,作为我们前端开发统一架构研发的基础。 在借鉴、阅读代码、代码实践的过程中,我们需要在设计模式或第三方框架、库选择上进行分析及比较。
最终,我们希望采用融合方式,扩展出适合我们的前端统一架构。
现在能够明确下来的是:
- Omi 腾讯的前端架构,基本上与tarojs如出一辙。属于仿React自己封装。后面有些稳定、集成测试结果,发现有很多不兼容React及Antd部分。 属于腾讯自己生态圈玩的架构。
- VSCode 的微内核部分,我们已经抽取被可利用实现。完全不依赖任何第三方。
- Umi 阿里企业级React应用框架,相对比较来讲,比较成熟,与自家的Antd及React兼容性比较好。
基于发展考虑,我们的改动都是非常谨慎,且微小的,不会对借鉴框架造成稳定风险。
框架稳定性检测:
- Omi基础类API接口稳定情况; ☛ 测试结果:核心接口稳定,但个别API功能单一。
- VSCode微内核接口稳定情况; ☛ 测试结果:非常稳定。
框架兼容性检测:
- Omi与React 新特性兼容情况;☛ 测试结果:仿React自己封装,升级特性,不兼容
- Omi与Web 新特性兼容情况; ☛ 测试结果:自己封装,存在技术壁垒
- Omi与Antd UI库的兼容情况; ☛ 测试结果:简单控件可用,大部分Antd控件不能结合一起使用,编译出错。(原因:腾讯封装,类React语法,上下文环境强注入,有破坏性)
- Umi与Antd UI库的兼容情况; ☛ 测试结果:Umi与Antd都是React技术栈,融合度非常高,暂没发现兼容性大问题。
- Umi与React 新特性兼容情况; ☛ 测试结果: Umi与Antd都是React技术栈,融合度非常高, 支持新特性。
- VSCode微内核兼容情况;☛ 测试结果: 由于VSCode采用完全自己开发实现,不依赖任何第三方,代码质量非常高,兼容性没有问题。
后续工作:
- 前端框架梳理 Ver1.0 实现;
- 梳理技术入门文档;
- 应用Demos
- 实现wodax-umi-cli 脚手架 Ver1.0,定制我们的后台应用及移动H5,小程序的创建;
- 基于VSCode的Services,Extension为内核框架将以第三方库的形式提供;
- Demo Online上线
- API 文档上线
参考框架推荐阅读:(根据需要,会陆续添加 ....)
符号含义:☺, 表示极力推荐阅读; √, 表示推荐; •, 表示可以使用,但不作重点;
数据类型检测
基础
UI Stack (UI技术栈)
UI Designer Libraries (UI设计库)
- 基础UI组件库
- 数据可视化组件库
- Canvas 绘制
- 技术痛点解决
- √(https://github.com/Tencent/omi/tree/master/packages/omi-transform)
- √(https://github.com/Tencent/omi/tree/master/packages/omi-touch)
- √(https://github.com/Tencent/omi/tree/master/packages/omi-tap)
- √(https://github.com/Tencent/omi/tree/master/packages/omi-snap)
- √(https://github.com/Tencent/omi/tree/master/packages/omi-finger)
Store Management (状态管理/数据流解决方案)
- Flux 单向数据流 - √(https://redux.js.org/) - √(https://redux-saga.js.org/) - √(https://github.com/dvajs/)
- Reactive 响应式数据流 - √(https://mobx.js.org/) - √(https://github.com/Tencent/omi/tree/master/packages/omi-mobx) - √(https://github.com/Tencent/omi/tree/master/packages/omi-mvvm)
Route (路由配置)
REST (Web API)
- √ 内置的Fetch
- ☺(https://github.com/axios/axios)
Code Format Rule (代码格式规则)
Package Management (依赖包管理)
Project Build (工程构建)
Task Code (任务编辑)
Test (测试框架)
Debug Tools (调试工具)
- Web Debug 网页调试
Code IDE 代码编程工具
Cloud (小程序云端)
Render Web Components to Native (渲染Web组件到原生)
Native (Android/iOS) 构建移动App,支持Android和iOS
Native Frameworks and Libraries (核心本地底层框架库, 适用于Android,iOS, macOS, Windows)
Core (核心架构)
1.0.1
5 years ago