12月20日,腾讯开源跨端框架 Hippy。 在腾讯内部,Hippy 已运行3年之久,跨 BG 共有 18 款线上业务正在使用 Hippy,日均 PV 过亿,且已创建一套完整生态。相较于其余跨端框架,Hippy 对前端开发者更友好:紧贴 W3C 标准,听从网页开发各项规则,使用 JavaScript 为开发语言,同时支持 React 和 Vue 两种前端主流框架。前端
“跨端”是目前前端界比较流行的一个词汇。“跨端”之因此流行,根源在于传统网页开发受浏览器能力限制太大,尤为是各家浏览器的不一样实现、离线能力和性能上的缺陷致使 App 很难知足用户体验的需求。跨端框架本质上是将终端能力以一种形式提供业务开发使用,能够无限制地使用全部终端能力的同时,尽可能让业务开发只编写一套代码,这样既能知足性能需求,又能减小开发成本。vue
但纵观整个社区内的跨端开发框架,仍旧存在两个主要问题:react
出现上述问题的缘由,是由于目前业内的跨端框架,大部分由终端开发者主导开发,并非从前端开发者角度出发的,因此对于前端开发者来讲不够友好。git
Hippy 跨端框架是由QQ 浏览器部门发起的,针对前端开发者推出的跨端解决方案。为业内现存问题,Hippy 紧贴 W3C 标准,听从网页开发各项规则,从前端开发人员角度出发,使用 Javascript 为开发语言,同时支持 React 和 Vue 两种前端主流框架。对于前端开发者而言,Hippy 上手难度会更低,学习曲线会更平滑。github
Hippy 实现了相似 Flutter 的引擎直通架构(在 React Native 中的 Fabric 架构),经过 C++ 开发的模块直接插入 JS 引擎中运行,绕过了前终端通信编解码的开销,有效提高了 JS 前端代码和终端的通信性能。在此基础之上,Hippy 正在实现高性能自绘,以提供更强的性能和更好的用户体验。web
hippy-react 从语法上更加接近终端底层,某种程度上语法接近 React Native,同时经过官方提供了 hippy-react-web 组件库,也能够方便地生成 Web 版网页。浏览器
全民 K 歌架构
react + hippy-react + hippy-react-web框架
hippy-vue 的组件、参数和接口彻底符合浏览器标准,前端开发用浏览器标签和经常使用的 CSS 选择器就能够完成跨端界面绘制。其优点以下:性能
事实上,hippy-vue 其实只是浏览器上的 Vue 在终端上的一个渲染层,理论上大多数 Vue 在网页上的生态能够直接迁移过来。
王者营地
vue + hippy-vue
Hippy 在腾讯内部已经有一套完整生态,包含 GCanvas、Lottie、SVG 等都有对应组件封装,同时包含腾讯内部自研的 Hippy 业务组件库、高性能图形库、异常上报(支持 Sentry)等,也会在将来逐步对外开放。
Hippy 正式开源Github 地址:github.com/Tencent/Hip…
欢迎关注「云加社区」,Hippy 的实战和原理解析系列文章将会陆续上线。