非死book开源跨平台前端布局引擎Yoga

   <p style="text-align: center;"><a href="/misc/goto?guid=4958992220058155744" title="非死book"><img alt="非死book开源跨平台前端布局引擎Yoga" src="https://simg.open-open.com/show/7335b414f3b8f2f6a943cf004cf9ef11.gif" /></a></p>    <p>随着这几年前端技术的崛起，作为前端 UI 骨架的布局系统也在其中占据了越来越重要的位置。不管是在移动端、桌面端还是 Web 端，特别是不同设备的屏幕大小和分辨率千变万化，如何构建良好的布局系统以便应付这些变化已经变得越来越重要。</p>    <p>目前，各个平台都有自己的一套解决方案。iOS 平台有自动布局系统，Android 有容器布局系统，而 Web 端有基于 CSS 的布局系统。多种布局系统共存所带来的弊端是很明显的，平台间的共享变得很困难，而每个平台都需要专人来开发维护，增加了开发成本。</p>    <p>非死book 在这个问题上没有少下功夫。首先，非死book 在 React Native 里引入了一种跨平台的基于 CSS 的布局系统，它实现了 <a href="/misc/goto?guid=4958996763339972676">Flexbox 规范</a>。基于这个布局系统，不同团队终于可以走到一起，一起解决缺陷，改进性能，让这个系统更加地贴合 Flexbox 规范。</p>    <p>随着这个系统的不断完善，非死book 决定对它进行重启发布，并取名 Yoga。虽然目前还不知道为什么会给它取名 Yoga，但从字面理解——瑜伽——我们很自然地联想起柔韧、舒展、变化等名词，这个跟布局系统的跨平台特性似乎不谋而合。借助 Yoga，开发人员不仅可以在 React Native 里，还能在各个平台上快速地构建 UI 布局。</p>    <p>Yoga 是基于C实现的。之所以选择C，首先当然是从性能方面考虑的。基于C实现的 Yoga 比之前 Java 实现在性能上提升了 33%。其次，使用C实现可以更容易地跟其它平台集成。到目前为止，Yoga 已经有以下几个平台的绑定：Java（Android）、Objective-C（UIKit）、C#（.NET）。而且已经有很多项目在使用 Yoga，比如 <a href="/misc/goto?guid=4958996763470805373">React Native</a>、<a href="/misc/goto?guid=4958996763596418741">Components for Android</a>、<a href="/misc/goto?guid=4958996763712464318">Oculus</a>，等等。</p>    <p>不同于其它的一些布局框架，比如 bootstrap 的栅格系统或 <a href="/misc/goto?guid=4958877303436721101">Masonry</a>，它们要么不够强大，要么不支持跨平台。Yoga 遵循了 Flexbox 规范，同时又将布局元素抽象成 Node，为各个不同平台暴露出一组标准的接口，这样不同的平台只需实现这些接口就可以了。</p>    <p>当然，非死book 不会就此止步。作为一款跨平台的布局引擎，自然需要各个平台的开发人员一起努力来促进它的发展，所以 非死book 把 Yoga 开源了。目前微软已经成为 Yoga 的贡献者之一，他们不仅修复缺陷，还为 Yoga 带来新的特性。</p>    <p>除了完全遵循 Flexbox 规范，非死book 还计划在未来为 Yoga 加入更多特性，这些特性将超出 Flexbox 的范畴。</p>    <p>Yoga 的源码托管在 <a href="/misc/goto?guid=4958996763881282759">GitHub</a> 上，有兴趣开发人员可以在上面进行反馈。</p>    <p>来自: <a href="/misc/goto?guid=4958996789370376296" id="link_source2">InfoQ</a></p>