前言
本文从KUN在闲鱼落地为出发点,介绍如何通过KUN实现Web和Flutter技术增强你的移动应用程序。
在结合了Web和Flutter的各自优势,以及它们背后良好的生态和社区支持,你能用它来覆盖你的所有上层业务,达到更佳的动态化效果。
介绍KUN
KUN 是一个让开发者使用 Javascript,HTML,CSS进行开发,使用Flutter进行增强的跨端开发框架。
![null e93dbc90649826be5f3da0a98be9a63c.png](https://i-blog.csdnimg.cn/blog_migrate/e948993238d1a21ba8b636e8ec633abb.png)
为什么选择KUN
首先我们分析下Flutter与H5的情况
• Flutter:
• 优点:UI达到像素级跨端水平,业务逻辑一致性得到保证
• 缺点:工程打包成本较高,仍依赖发版,缺乏页面级动态性
• H5:
• 优点:页面动态性强,发版迅速
• 缺点:体验性较差,复杂交互实现困难
KUN是结合闲鱼技术在flutter技术领域的天然优势,去混合连接 JS 生态 & Flutter 生态,通过更加开放 & 更加轻量化的设计,在效率、体验、通用性上去取的最佳平衡。
KUN工程化体系
KUN很好的复用前端的工程化体系
• KUN实现了标准W3C的子集,能很好的接入前端体系。这样可以让业务同学"零"学习成本就可以上手 KUN 的开发,同时使用 Web 技术开发的应用也能很容易地迁移到 KUN 上。
• 作为世界上最活跃的开发者群体 -- Web 开发者,以及庞大的前端生态体系,KUN允许开发者使用社区中已有的 100W+ npm 包来帮助业务提升开发效率
• 成熟的前端配套开发工具,你可以使用 VSCode、WebStrom 进行代码的编写,使用代码提示和 ESLint 规则检测来保证代码质量,使用 jest 等单元测试工具来,使用 webpack 进行代码的打包等等。
KUN对原有前端工程化的改变
1. 为KUN容器实现新的脚手架,用于创建KUN的前端应用
2. 在发布产物平台/离线包预置平台增加 KUN产物 (JSBundle/ByteCode)
3. 在前端监控体系增加KUN容器异常监控
4. 在性能平台增加统计KUN容器启动时长、白屏率、加载失败率等数据
KUN在闲鱼的落地
闲鱼超市/我发布的/闲鱼号
![null e6d9b9e087e680eaf264974154798e42.png](https://i-blog.csdnimg.cn/blog_migrate/76c6a3930d2fe9267b624c9362a4639e.png)
读者可以下载最新版闲鱼客户端打开闲鱼超市/我发布的/闲鱼号,体验KUN容器带来的体验升级。
后续KUN将会接入更多闲鱼核心业务。今年闲鱼双十一会场会使用KUN容器。这是一次对KUN的机遇和挑战。
回到主题,为了保证前端业务在KUN容器中落地,KUN打通了闲鱼的前端开发链路。
下面介绍下如何使用KUN进行开发
开发流程
1.准备工作
•