专栏首页腾讯开源的专栏腾讯高性能跨端框架 Hippy 正式开源

腾讯高性能跨端框架 Hippy 正式开源

Hippy介绍视频

简介

Hippy 是一款高性能跨端开发框架,为前端开发者提供他们所熟悉的 React、Vue 来进行高性能跨端开发,克服了 H5 开发时受浏览器接口和实现不统一的限制,能够充分使用客户端能力,并保留了 H5 开发的灵活性。

该项目在腾讯内部已经运行达3年之久,已经跨 BG 共有 18 款线上业务使用,日均 PV 过亿。该框架实现了类似 Flutter 的引擎直通架构(在 React Native 里叫 Fabric 架构),通过 C++ 开发的模块直接插入 JS 引擎中运行,绕过了前终端通讯编解码的开销,有效提升了 JS 前端代码和终端的通讯性能,同时以高性能自绘为下一个主要目标正在开发中。在版本升级的同时,我们也很注重向上兼容性,保证业务代码在所有版本上都能够稳定运行。

Hippy 在腾讯内部已经有一套完整生态,包含 GCanvas、Lottie、SVG 等都有对应组件封装,同时包含腾讯内部自研的 Hippy 业务组件库、高性能图形库、异常上报(支持 Sentry)等等也会在未来逐步对外开放。

主要特性

对于用户体验、高效开发迭代,Hippy 将是你最好的选择。

Hippy 具有以下优势:

一、开发效率高。根据使用 Hippy 业务经验看,使用 HIppy 开发相对于原有 Android 和 iOS 双端开发,可节省 70% 人力。

二、稳定性好。目前 Hippy 引擎日启动次数超15亿,引擎加载成功率 99.9992%,业务加载成功率 99.985%。

三、迭代快。业务发版周期减少 75% ~ 100%。

四、性能高。平均帧率高于同期竞品,自研 Layout 引擎超越 Yoga。

五、扩展性好。Hippy 采用分层设计思想,通过上下层抽离和解耦,将整体划分为框架层、引擎层、渲染层。每层均可自由替换。框架层既可以使用 React 也可以使用 Vue,或者未来的新兴框架。引擎层可以使用 JS,将来也支持 Dart,Lua 等语言。渲染层目前使用原生 Native 绘制,明年也将支持自绘,业务可以根据需求自由选择。

六、无协议风险。Hippy 完全自研,使用自由宽松的 Apache 协议,商业项目可放心使用。

业内现状

“跨端”是目前前端界比较流行的一个词汇。“跨端”之所以流行,根源在于传统网页开发受浏览器能力限制太大,尤其是各家浏览器的不同实现、离线能力和性能上的缺陷导致 App 很难满足用户体验的需求。跨端框架本质上是将终端能力以一种形式提供业务开发使用,可以无限制地使用所有终端能力的同时,尽量让业务开发只编写一套代码,这样既能满足性能需求,又能减少开发成本。

但纵观整个社区内的跨端开发框架,仍旧存在两个主要问题:

  • 跨端框架对前端开发者来讲难度较高,如果不具备移动终端开发能力,很难上手;
  • 平台差异大,相同功能甚至要为不同的平台使用不同的接口编写大量平台相关代码。

出现上述问题的原因,是因为目前业内的跨端框架,大部分由终端开发者主导开发,并不是从前端开发者角度出发的,所以对于前端开发者来说不够友好。

框架优势

Hippy 跨端框架是由QQ 浏览器部门发起的,针对前端开发者推出的跨端解决方案。为业内现存问题,Hippy 紧贴 W3C 标准,遵从网页开发各项规则,从前端开发人员角度出发,使用 Javascript 为开发语言,同时支持 React 和 Vue 两种前端主流框架。对于前端开发者而言,Hippy 上手难度会更低,学习曲线会更平滑。

Hippy 实现了类似 Flutter 的引擎直通架构(在 React Native 中的 Fabric 架构),通过 C++ 开发的模块直接插入 JS 引擎中运行,绕过了前终端通讯编解码的开销,有效提升了 JS 前端代码和终端的通讯性能。在此基础之上,Hippy 正在实现高性能自绘,以提供更强的性能和更好的用户体验。

Hippy-react 从语法上更加接近终端底层,某种程度上语法接近 React Native,同时通过官方提供了 hippy-react-web 组件库,也可以方便地生成 Web 版网页。

全民 K 歌

react + hippy-react + hippy-react-web

Hippy-vue 的组件、参数和接口完全符合浏览器标准,前端开发用浏览器标签和常用的 CSS 选择器就可以完成跨端界面绘制。其优势如下:

  • 前端开发基本了解一下 hippy-vue 开发的限制就可以上手跨端开发;
  • 可以复用 Web 端绝大多数的生态;
  • 不需要 Web 转接库就可以直接生成网页。

事实上,hippy-vue 其实只是浏览器上的 Vue 在终端上的一个渲染层,理论上大多数 Vue 在网页上的生态可以直接迁移过来。

王者营地

vue + hippy-vue

真诚开源

我们期望通过将 Hippy 开源,能够有助于业界其他相关领域的应用,也希望更好的完善产品本身,如果你对这个框架感到兴趣,还请给这个项目一个 Star,欢迎提出你的 issue 和 PR!

Hippy 正式开源!

Github 开源地址:

https://github.com/Tencent/Hippy

(点击文末阅读原文直接访问)

请给 Hippy 一个 Star !

欢迎提出你的 issue 和 PR!

 Hippy 国内镜像地址:

https://git.code.tencent.com/Tencent_Open_Source/Hippy

(登录后才能访问公开项目)

腾讯工蜂源码系统为开源开发者提供完整、最新的腾讯开源项目国内镜像

本文分享自微信公众号 - 腾讯开源(tencentopen)

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2019-12-30

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 腾讯将添 AI 开源项目! 腾讯 AI Lab 开源业内最大规模多标签图像数据集

    2018年9月10日,深圳 - 今日,腾讯AI Lab宣布将于9月底开源“Tencent ML-Images”项目,该项目由多标签图像数据集ML-Images...

    腾讯开源
  • 首届Apache Hadoop技术社区中国Meetup在京举办(内附完整PPT)

    ? 近日,在Apache Hadoop社区主导及邀请下,腾讯开源、腾讯大数据、腾讯云联合承办了Hadoop技术社区在中国的首次Meetup。围绕Hadoop技...

    腾讯开源
  • 腾讯作为ApacheCon2019主会唯一受邀中国企业亮相谈开源

    近日,一年一度的国际开源顶会ApacheCon 2019在美国举办,正值 Apache 软件基金会(Apache Software Foundation,AS...

    腾讯开源
  • 7篇ICLR论文,遍览联邦学习最新研究进展

    2020 年的 ICLR 会议原计划于4 月 26 日至 4 月 30 日在埃塞俄比亚首都亚的斯亚贝巴举行,这本是首次在非洲举办的顶级人工智能国际会议,但受到疫...

    机器之心
  • 【vscode插件】获取当前激活的编辑器及其信息详解

    selection.active 当前光标位置 Position 类型 如果有选中的文本,这里是被选择文本的最后,细心的你会发现,选择了文本后,光标也是会存在的...

    黒之染
  • CentOS下RabbitMq高可用集群环境搭建教程

    192.168.40.130 rabbitmq01 192.168.40.131 rabbitmq02

    砸漏
  • 一份走心的iOS开发规范前言约定(一)命名规范(二)编码规范2.14 内存管理规范本文参考文章其他有价值的文章

    VV木公子
  • WWW2020 | 基于GNN和哈希学习的高效推荐系统

    最近看了篇利用哈希技术来提高基于图神经网络的推荐系统检索速度的文章。该文的亮点本人认为主要有以下两点:(1)模型同时学习用户/物品的实值表示和离散表示,用于协调...

    用户3578099
  • git仓库管理

    参考 https://www.cnblogs.com/youcong/p/10809085.html

    悟空聊架构
  • C++服务器开发之基于对象的编程风格

    Thread.h #ifndef _THREAD_H_ #define _THREAD_H_ #include <pthread.h> #include <b...

    用户1198337

扫码关注云+社区

领取腾讯云代金券