专栏首页Hippy 跨端框架腾讯开源内部跨端框架 Hippy,打磨三年,日均 PV 过亿
原创

腾讯开源内部跨端框架 Hippy,打磨三年,日均 PV 过亿

12月20日,腾讯开源跨端框架 Hippy。 在腾讯内部,Hippy 已运行3年之久,跨 BG 共有 18 款线上业务正在使用 Hippy,日均 PV 过亿,且已建立一套完整生态。相较于其他跨端框架,Hippy 对前端开发者更友好:紧贴 W3C 标准,遵从网页开发各项规则,使用 JavaScript 为开发语言,同时支持 React 和 Vue 两种前端主流框架。

视频内容

业内现状:大部分跨端框架对前端开发者不够友好

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

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

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

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

腾讯跨端解决方案 Hippy:前端开发者更易上手

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 选择器就可以完成跨端界面绘制。其优势如下:

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

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

王者营地 vue + hippy-vue

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

Hippy 正式开源Github 地址:https://github.com/Tencent/Hippy

欢迎关注「云加社区」,Hippy 的实战和原理解析系列文章将会陆续上线。

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

登录 后参与评论
0 条评论

相关文章

  • 腾讯最新开源项目登上GitHub热榜:QQ音乐等18项业务都在用,日均PV过亿

    腾讯介绍称,Hippy是一个新生的跨端开发框架,目标是使开发者可以只写一套代码就直接运行于三个平台(iOS、Android 和 Web)。

    量子位
  • 腾讯高性能跨端框架 Hippy 正式开源

    Hippy介绍视频 简介 Hippy 是一款高性能跨端开发框架,为前端开发者提供他们所熟悉的 React、Vue 来进行高性能跨端开发,克服了 H5 开发时...

    腾讯开源
  • hippy-react 三端同构

    Hippy (https://github.com/Tencent/Hippy) 是腾讯在2019年12月20日开源跨端框架。

    17kidd
  • 又一个跨端框架来了! 腾讯开源内部跨端统一开发框架:Hippy!

    最近腾讯出了一套跨端开发框架 :Hippy 其实早在今年年初微信也出了一套:腾讯微信发布多端统一框架 Omi

    开发者技术前线
  • Hippy 常用调试方法和常见问题案例

    近日,腾讯开源跨端框架 Hippy,一周即吸引3000+star。在腾讯内部,Hippy 已运行3年之久,跨 BG 共有 18 款线上业务正在使用 Hippy,...

    xuqingkuang
  • 解密腾讯前端技术体系

    为了了解当前前端的发展趋势,让我们从国内各大互联网大厂开始,了解他们的最新动态和未来规划。这是解密大厂前端技术体系的第三篇,前两篇已经讲述了阿里和百度在前端技术...

    前端迷
  • 开源项目介绍 |Hippy-跨平台动态化框架

    2021腾讯犀牛鸟开源人才培养计划 开源项目介绍 滑至文末报名&提交项目Proposal Hippy项目介绍 Hippy-跨平台动态化框架,是腾讯自研动态...

    腾讯开源
  • 腾讯十大最受欢迎的开源项目!

    MMKV 是基于 mmap 内存映射的 key-value 组件,底层序列化/反序列化使用 protobuf 实现,性能高,稳定性强。从 2015 年中至今在微...

    肉眼品世界
  • IMWebConf 2018 圆满落幕,精彩内容回顾

    2018年10月14日,第七届IMWebConf前端大会在深圳科兴国际会议中心成功举办。今年大会现场参会人员近500人,线上直播参与人数累积近千人。 IMWe...

    腾讯NEXT学位
  • 开源项目介绍 |TKEStack-开源容器服务平台

    ‍‍ 滑至文末报名参与开源人才培养计划 提交项目Proposal TKEStack项目介绍  标签:容器,, Kubernetes  技术:golang T...

    腾讯开源
  • 精选腾讯技术干货200+篇,云加社区全年沙龙PPT免费下载!

    “看一看”推荐模型揭秘!微信团队提出实时Look-alike算法,解决推荐系统多样性问题;

    风间琉璃
  • 2019TLC大会精彩回顾—大前端·信息流

    2019年8月17日,第三届TLC大会在科兴科学园国际会议中心完美落下帷幕。作为一年一度的技术盛会,本次大会云集国内外19名技术专家,现场参会人数超过600人,...

    腾讯IVWEB团队
  • 腾讯作为BAT之一,都有哪些开源的牛批项目?

    阿里、百度互联网大厂的开源成果,BAT 三家就差一个腾讯了。近几年腾讯重视开源,先后开源了很多受欢迎的项目,今天就盘点一下腾讯开源的受欢迎的项目。

    Java程序猿
  • IMWebConf 2018 前端大会倒计时 4 天!五大会场精彩内容抢先看

    今天是2018年10月10日,距第7届 IMWebConf 前端大会开幕仅剩 4 天!  IMWebConf 是由腾讯前端 IMWeb 团队发起的国内顶级前端技...

    腾讯NEXT学位
  • 开源项目介绍 |Apache Ozone-分布式大数据通用存储

    2021腾讯犀牛鸟开源人才培养计划 开源项目介绍 滑至文末报名参与开源人才培养计划 提交项目Proposal Apache Ozone项目介绍 标签:大数据...

    腾讯开源
  • 全民K歌跨端体系建设

    跨端技术的本质是实现代码复用,减少开发者在多平台上的适配工作量,移动互联网发展至今,跨端技术经历了许多阶段,大体上可以分成如下四类:

    前端森林
  • 跨园区容灾,升级不停服:高可用负载均衡集群实践

    近期,针对一些客户对腾讯云产品可用性的问询,腾讯云基础产品团队对负载均衡产品的原理做出详细阐述,并希望通过对腾讯负载均衡集群底层架构的实现的讲解分析,揭示其强劲...

    腾讯云中间件团队
  • 开源项目介绍 |TNN-跨平台AI推理框架

    2021腾讯犀牛鸟开源人才培养计划 开源项目介绍 滑至文末报名参与开源人才培养计划 提交项目Proposal TNN项目介绍         标签:人工智能...

    腾讯开源
  • 静态网站架构的演进和最佳实践

     支撑10亿PV的云存储 新冠肺炎期间,约翰霍普金斯大学开发的疫情地图网站单日PV达10亿次,查看源代码可以看出它是一个单页应用(single-page ap...

    云存储

扫码关注云+社区

领取腾讯云代金券