气泡，气泡，气泡…

气泡可能意味着愉悦而轻松的沐浴，或者对某人来说只是个不错的杜松子酒。

在Tuenti，当有人说Bubbles时，我们对会话组件进行了重新设计。 该组件对于我们的应用程序非常重要。 我们将所有与其他朋友或其中一些朋友共享的内容放置在此处。 例如，我昨天发送给您的短信，由于找不到您而不得不与您共享的位置或仅仅是我打电话预订餐厅的电话。 为了由用户以容易和愉快的方式消费，必须显示越来越多的内容。

它由我们的出色设计师负责，可以确定没有问题！ 他们提出了可以针对各种新内容和现有内容进行扩展的设计，但是工程师始终知道必须在代码中实现的那些工件。

“圆角太多！”，“渲染文字会影响性能……”，“滚动条不会很平滑……”

是的 很多评论，很多投诉，但我们所有人都希望得到最好的方法。 我们在谈论UI，所以让我们看看UIKit。 这是我们基于项目的框架。 从此开始，我们发现了一些严重影响性能的点：

• 渲染文本很昂贵。
• 单元格的类型很多，大多数都非常不同，主要是它们的高度。
• 增加拐角半径可能会使主螺纹过载。

然后，我们问自己：

• 我们应该在没有XIB / 情节提要的情况下进行绘制吗？
• 我们不应该使用自动排版并获取每一帧吗？
• 单元格的高度呢？ 由我们计算？

UIKit进行了很多更改，但似乎已经得到了很大的改进……恕我直言，UIKit的性能越来越差，我不知道这对某人是否重要。

使用单元格的自动高度，我们可以看到主线程使用率很高，并且该应用程序无法使用。 带有多行的UILabel即使没有电话/ URL检测之类的基本功能，也会影响性能。 似乎我们需要像CoreText这样的低级库。 我们仍然尚未启动该项目，但发现了很多问题……

我们的项目基于Model-View-Presenter （ MVP ）。 M和P已经解决，因此让我们使用“虚拟”视图V和Texture框架进行测试， Texture框架已在我们有趣的HackMeUp中经过PoC测试！ 而且还不错🙂

好吧，这是“惊人的”，但是……什么是纹理 ？

“纹理是建立在UIKit之上的iOS框架，即使最复杂的用户界面也可以保持平滑和响应。”

噢，但是…… 纹理到底是什么？

基本上， Texture是一个框架，该框架内部使用UIKit来呈现视图的UI，从而优化了后台中的每个计算，这意味着避免使用主线程并失去FPS。 在Texture世界中，每个UI组件都是一个节点。 它们基本上是UI组件的包装。 节点提供了非常相似的接口，因此将其集成是一个优势。 让我们从ASTableNode开始，它将取代我们的UITableView。

我们需要创建ASCellNodes来表示每个内容，而不是UITableViewCell。 ASTableNode可以确定单元节点的高度。 这是否意味着它像带有UITableViewAutomaticDimension的UITableView一样工作 ？ 它没有，它做得更好。 此外，它还使用其智能预加载功能来计算背景中的高度。 它适用于三种状态：

• 预加载：在后台为尚未出现的单元加载网络资源和异步请求。
• 显示：也许这是最有趣的。 这里Texture利用了计算像元布局，栅格化文本和解码图像的优势。 以及所有这些背景。
• 可见：它属于要显示的单元格。

哇！ 一切看起来都很棒，我们不需要太多利用这些东西，但是……我们应该如何创建单元？

我们要在对话中表示的每个内容都应该是一个单元格。 现在，我们将创建ASCellNode的子类。 我们需要什么？ 我们不需要的是图形界面。 我们将需要使用诸如ASTextNode （ UILabel包装器）， ASImageNode （ UIImageView ），甚至更有趣的节点（如ASNetworkImageNode或ASVideoNode ）之类的子组件来实现其布局。 它们都有很多惊人的功能，您可以在这里阅读。 我将使用“呼叫”节点示例来说明每个步骤：

分析单元格，我们可以看到它由几个子组件组成：

首先，我们有一个条件变量：显示/隐藏。 依赖于此，它会出现在头像下方，左边缘或从视图中删除。

如果我们想显示/隐藏打字指示器，我们只需要调用：

基本上，我们需要调用transitionLayout方法，该方法将重画执行layoutSpecThatFits的整个节点。 另外，将调用此方法，并且在这里我们将能够实现所需的动画。

使用ASContextTransitioning，我们将获得最终/初始位置，然后可以计算要设置动画的帧。

结论

经验是非常积极的。 我们发现了一种很好的工具，可以最佳地绘制用户界面，因为照顾好性能通常是一项繁琐的工作。

队友一直在研究此组件，以开发新的内容/节点，非常快速地学习Texture 。 即使我们没有.XIB / Storyboards，该代码也非常有意义。

尽管我们有很好的解决方案，但仍需要改进许多方面，例如应用一些可以提供更高性能的工具。 对于我们的产品而言，更多功能可能很棒，例如ASTableNode 预取 ，我们将能够模拟内容的无限滚动等。