【html渲染引擎ios】

原始链接:

Pluto是iOS上的排版渲染引擎. 可以通过JSON / JS文件方便地描述界面元素. 开发效率很高，保证了流畅性和存储便利性.

Qzone Feed业务很复杂，并且样式很多. 每次添加新的提要样式时，开发工作量都很繁重，需要遵循该版本. 样式之间存在严重的耦合，每次更改一种样式都可能会影响另一种样式.

基于此背景，Feed团队急需更成熟的渲染引擎. 他至少需要解决以下问题:

1. 提高开发效率.

2. 样式是独立的，不会相互结合.

3. 新的和修改的供稿样式不需要遵循该版本.

4. 无论采用哪种计划，列表的滑动流畅度至少必须与现有的相同.

基于此需求，我们重新发明了市场上更成熟的字体渲染引擎ComponentKit，新的开发框架（如React Native），甚至引用了Android的字体系统. 很难同时解决上述问题，最终决定自己做一个专注于性能和开发效率的排版引擎Pluto. 目前，Pluto已应用于QQ和Qzone上的大多数空间提要样式. 关于Pluto与这些现有字体渲染引擎之间比较的细节，我将在后面解释，让我们看一下Pluto的使用方式.

首先，您需要输入排版说明:

上述排版数据的结果如下，左侧为图片控件，右侧为文本控件.

我一定看过这个演示，每个人都应该知道冥王星是什么. 上面的JSON文件也非常自然并且易于阅读. 接下来有很多问题需要解决. 这里的重点是单击事件，模板，重用和扩展. 解决了热更新，开发效率，性能优化和功能扩展四个问题.

点击事件

Pluto还可以描述通过json绑定事件响应的js脚本，例如以下json文件:

单击图像组件后，您可以找到相应的js文件并调用onClick方法.

在最初的示例中，使用JSON表示UI布局. 如果同时有许多相似的界面元素，那么将有许多具有重复数据的JSON文件. 目前，需要模板功能. 例如，列表中的每个单元格共享相同的模板，但填充的数据不同. 在以下示例中，将“ imageName”替换为“ $ {image}”而不是特定的图像. 然后提供字典映射，每个数据项映射不同的数据以产生不同的视图.

重用是Pluto在设计时一直关注的一个因素，也是与其他引擎不同的最大功能. 可以说，有了此功能，它可以应用于具有高性能要求的方案，例如列表. 重用意味着在滑动时，在列表控件（如UITableView）中，不同的列表项将重用同一Cell，并且可以重用Cell中的视图数据. 核心是减少创建视图和修改视图树的次数. 值得强调的是，Pluto中视图的重用优化是一个内置函数，并且调用方不需要其他操作.

实现原理如下图所示. 冥王星生成的每个视图都将包含一个重用池. 使用重用功能时，视图不会被破坏，但是会被回收. 它被放入重用池（这里的子视图是视图树，即也包含该子视图的子视图）并被隐藏. 多路复用时，您只需要恢复显示，调整宽度和高度，数据等，这远低于创建视图的成本.

Pluto具有一些内置的渲染控件，例如文本（TextItem），图片（ImageItem）和按钮（ButtonItem）. 如果这些组件不符合要求，您还可以通过扩展组件来完成封装. 实现自定义控件的一般过程如下:

演示中有一个演示，其中包含有关实现自定义视图的更多详细信息.

这是冥王星的一些功能.

快速: Pluto的排版性能与直接编写的排版代码的性能没有太大不同. 与移动QQ上的其他列表相比，流利性目前处于领先地位. （当然，它的性能要比自动版式好得多

异步: Pluto的整个布局（文本渲染过程）可以在辅助线程上执行，并且是线程安全的. 不会影响用户操作.

描述性排版: Pluto接收的排版信息是一个字典，它无需编写逻辑代码即可表达排版信息. 描述性的优点是:

●易于维护且不易出错（因为不包括代码）.

●便捷的缓存.

●可以JSON格式编写，在本地读取或在后台排版.

●不可变数据: 在整个排版引擎中，排版数据是不可变的，这意味着它易于维护，测试，缓存，重用以及线程安全.

缓存和重用: 由于排版数据是不可变的，因此将在内部对其进行缓存，这可以加快整个显示过程. 渲染部分将尽可能重用现有控件，以加快渲染速度. 同时，更新同一视图的排版数据，并进行内部比较. 排版过程将尽可能地重用旧的排版信息.

模板系统: Pluto具有完整的模板功能. 只需编写一次相同的样式即可形成模板，然后根据情况用不同的数据填充模板android渲染引擎，并生成不同的视图. 模板也可以通过组合来重复使用.

图形和文本混合: Pluto支持基本控件的混合，例如文本标签，图像标签，还支持自定义标签和自定义控件.

在进行比较和分析之前，让我们回顾一下使用Pluto的主要情况: 一个供稿列表，可以无限期加载更多供稿，这需要内存，CPU和流畅性.

根据这种情况，对现有主流界面开发库的比较分析是Storyboard / Xib，它与Xcode，Facebook主导的开源组件ReactNative，ComponentKit和Pluto一起提供.

●故事板是具有较高开发效率的可视UI编辑工具. 在性能方面，所有控件都使用本机控件android渲染引擎，因此性能会更差. 它还不支持异步排版，这会影响流畅性. 生成的文件使用XML进行描述，理论上可以动态分发，但是XML格式不是公开的，不能保证各种版本的兼容性，因此实现动态分发比较困难.

●React Native使用JS + HTML进行开发，开发效率非常高. 它也是高度动态和跨平台的. 但是，性能更为紧急. 在速度和内存使用方面存在一些问题. 如此高的性能要求很难放置进料流.

●ComponentKit与Pluto非常相似. 最大的区别是Component不支持JSON / XML的静态表达样式以及事件的动态绑定. 在动态性和可维护性方面，它会弱得多. 我们已经考虑过在ComponentKit的基础上添加JSON表达式样式的功能. 但是

ComponentKit直接使用本机视图，并且没有中间的虚拟视图层，因此性能也是一个问题. 转型的成本太高了.

●与React Native相比，Pluto的组件并不丰富，并且使用JSON可使开发效率在描述和排版方面接近React.

本地人；与其他组件相比，性能非常好；支持异步以确保主线程的流畅性；动态与React Native一样，您不能添加控件，控件是本地嵌入的. 它更依赖于本地代码的逻辑. 您不能修改本地代码的现有逻辑，但可以替换其中的一部分. 当然，如果逻辑只能被嵌入，则不会有审计风险.

合并表格如下:

腾讯WeTest iOS预审工具

为了提高IEG Apple审核的批准率，腾讯专门成立了一个Apple审核测试小组来创建此产品，即iOS预审核工具. 经过一年半的内部运营，腾讯内部应用程序的iOS批准率已从平均35％提高到90％以上.

现在已通过工具与您分享了腾讯内部产品评论的经验. 它可以在WeTest腾讯质量开放平台上使用. 点击立即体验！

如果在使用过程中有任何疑问，请联系腾讯WeTest企业QQ: 800024531

本文来自电脑杂谈，转载请注明本文网址：
http://www.pc-fly.com/a/jisuanjixue/article-187977-1.html