京东｜NutUI 京东小程序发布了！

Behance / 2023年2月4日

大厂复盘 160 1 0

可在下方连接中关注原账号原文链接：https://jelly.jd.com/article/6371fd1d660c90005e34210aNutUI 是一套京东风格的轻量级移动端组件库，目前已有 70+ 高质量组件，覆盖移动端主流场景。NutUI 3.1 版本上线后，增加了多端小程序适配能力…

NutUI 是一套京东风格的轻量级移动端组件库，目前已有 70+ 高质量组件，覆盖移动端主流场景。NutUI 3.1 版本上线后，增加了多端小程序适配能力，在微信小程序平台取得了很好的效果。而现在，NutUI 支持京东小程序开发了！

抢先体验

使用京东 APP 扫码体验：

背景介绍

京东小程序

京东小程序平台是一个全面开放的生态模式，它为开发者提供了沟通线上线下购物能力的方式，帮助商家和开发者以全新的方式连接消费者。

京东小程序平台具有优质用户、亿级流量和丰富渠道三大核心优势，提供了交易、营销、广告、客服、会员、支付、物流等多种开放能力，能更好的帮助商家服务京东高品质用户群体。同时入驻的商家还能享受到官方流量扶持政策，共享京东亿万级公域流量池，保证用户持续增长。目前在京东APP中已上线 17000+ 应用，典型产品如 LV 旗舰店、芝华士旗舰店、京东快递等。

NutUI

作为京东零售开源的移动端组件库，NutUI 目前已覆盖 Vue、React 两大前端开发框架，包含了 70+ 高质量组件，提供了详尽的文档与示例代码，能够帮助开发人员快速开发用户界面，提升开发效率，改善开发体验。

NutUI 支持组件级别定制主题，除了基于京东 APP 视觉规范的默认主题外，还提供了京东科技版（NutUI-JDT）、零售B商城版（NutUI-JDB）、京东企业业务（NutUI-JDDKH）等多个定制主题，能够满足业务定制化 UI 的诉求。

NutUI 3.1 版本上线后，正式开启了多端开发之路。NutUI 与 Taro 合力，实现了让开发者一处代码，多端运行，畅快自如地开发小程序。自上线以来，在集团内部已有大量使用 NutUI 进行开发的小程序案例，例如京东科技-企服中心、京东科技-京小贷、京东到店-门店端、京东物流-冷链、京东汽车-京安途、门店陈列执行管理等等，在外部社区也有前晨汽车、数智安全等案例。

NutUI 京东小程序

经过 NutUI 团队三个多月的努力，目前 NutUI 小程序版的全部 70+ 组件均已完成了对京东小程序的适配，其中还包括了 10+ 特色业务组件，能够覆盖大多数移动端应用场景。

下面是 NutUI 部分组件的效果示例图：

H5 与小程序开发对比

1、使用场景与用户体验

H5 页面通过链接访问，可以在任意浏览器、社交平台之间传播分享。用户每次打开时都需要重新下载页面资源，离开页面后则很难再次找到入口。总体上比较适合一些业务场景简单，同时对分享转发传播有需求的应用场景。小程序同样无需下载，即用即走，但在用户体验上接近原生 APP，对于业务逻辑复杂、涉及页面跳转较多、需要登录支付交易场景的应用，小程序具有显著优势。

2、运行环境与系统权限

H5 项目的运行环境通常是手机浏览器或者移动端 APP 的 WebView 容器，受限于此，在系统权限方面局限性较大。小程序则依赖于特定的客户端，在获得小程序平台的授权后，能够获取摄像头、定位、录音等更多系统权限，实现更丰富的应用功能和场景。京东小程序平台还为开发者提供了登录、分享、跳转、唤起等更多开放能力以满足开发者的业务诉求。

3、开发体验

从开发角度看，小程序平台提供的原生开发方式与 Web 开发存在差异，对编程语言也有一定的语法限制，不同小程序平台的项目并不兼容，迁移成本较大。相比之下，H5 项目几乎不存在兼容性问题，在主流移动端浏览器和 APP 内都能直接通过链接访问。不过，在 Taro 的帮助下，开发者可以使用 Vue/React 框架编写支持小程序和 H5 的项目。NutUI 也同时支持 H5 开发与小程序开发，开发者可以快速地将 NutUI 项目在 H5、京东小程序、微信小程序等平台之间相互迁移。