DDE 纵享丝滑，Treeland 技术揭秘！
<p><img class="alignnone size-full wp-image-35316" src="https://www.deepin.org/wp-content/uploads/2024/11/图片1-2.png" alt="" width="1876" height="799" srcset="https://www.deepin.org/wp-content/uploads/2024/11/图片1-2.png 1876w, https://www.deepin.org/wp-content/uploads/2024/11/图片1-2-300x128.png 300w, https://www.deepin.org/wp-content/uploads/2024/11/图片1-2-1024x436.png 1024w, https://www.deepin.org/wp-content/uploads/2024/11/图片1-2-150x64.png 150w, https://www.deepin.org/wp-content/uploads/2024/11/图片1-2-768x327.png 768w, https://www.deepin.org/wp-content/uploads/2024/11/图片1-2-1536x654.png 1536w, https://www.deepin.org/wp-content/uploads/2024/11/图片1-2-24x10.png 24w, https://www.deepin.org/wp-content/uploads/2024/11/图片1-2-36x15.png 36w, https://www.deepin.org/wp-content/uploads/2024/11/图片1-2-48x20.png 48w" sizes="(max-width: 1876px) 100vw, 1876px" /></p><p>近日，deepin（深度）社区亮相COSCon'24 第九届中国开源年会开源市集且社区资深桌面研发工程师张丁元为大家来了《Treeland，DDE进步的阶梯》技术分享。</p>
<p>就着这个机会，今天就让我们一起来聊聊如何在追求华丽动画和流畅体验的同时，还能保持系统的轻盈和高效。这就像是在玩一场平衡游戏，设计师和架构师各自站在天平的两端，一边是视觉盛宴，另一边是性能怪兽。这两者之间的平衡，就需要我们研发团队来巧妙地“牺牲”一些头发（脑力）来实现了。</p>
<p><img loading="lazy" class="alignnone size-full wp-image-35317 aligncenter" src="https://www.deepin.org/wp-content/uploads/2024/11/0D0A0139-3287530174.jpg" alt="" width="1600" height="1066" srcset="https://www.deepin.org/wp-content/uploads/2024/11/0D0A0139-3287530174.jpg 1600w, https://www.deepin.org/wp-content/uploads/2024/11/0D0A0139-3287530174-300x200.jpg 300w, https://www.deepin.org/wp-content/uploads/2024/11/0D0A0139-3287530174-1024x682.jpg 1024w, https://www.deepin.org/wp-content/uploads/2024/11/0D0A0139-3287530174-150x100.jpg 150w, https://www.deepin.org/wp-content/uploads/2024/11/0D0A0139-3287530174-768x512.jpg 768w, https://www.deepin.org/wp-content/uploads/2024/11/0D0A0139-3287530174-1536x1023.jpg 1536w, https://www.deepin.org/wp-content/uploads/2024/11/0D0A0139-3287530174-24x16.jpg 24w, https://www.deepin.org/wp-content/uploads/2024/11/0D0A0139-3287530174-36x24.jpg 36w, https://www.deepin.org/wp-content/uploads/2024/11/0D0A0139-3287530174-48x32.jpg 48w" sizes="(max-width: 1600px) 100vw, 1600px" /></p>
<p style="text-align: center;">张丁元在 COSCon'24 演讲</p>
<p> </p>
<h1 style="text-align: center;"><strong>历史背景</strong></h1>
<p>在 deepin 15 时期，开发团队使用 Mutter 为高性能设备提供流畅图形效果，用 Metacity 为低配置设备保证系统流畅性。但在 deepin 20 时期，团队决定采用 KWin 作为新窗口管理器，因其具备强大功能且可关闭合成器，适应不同硬件配置。因此，放弃了 Mullter+Metacity 的组合，以确保在各种设备上提供流畅安全的图形界面体验。然而，技术的不断发展促使我们再次面临技术革新。</p>
<p> </p>
<h1 style="text-align: center;"><strong>技术选择：X11 与 Wayland</strong></h1>
<p>在 Linux 下目前有两个技术栈，一个是历史悠久的 X11，另一个是较新的 Wayland 。接下来，跟随我一起来对比两个技术。</p>
<div class="su-table su-table-alternate">
<table style="border-collapse: collapse; width: 521.42pt;" border="0" width="869" cellspacing="0" cellpadding="0">
<tbody>
<tr style="height: 15.60pt;">
<td style="height: 15.60pt; width: 136.20pt;" width="227" height="26"></td>
<td class="et3" style="width: 206.40pt;" width="344">X11</td>
<td class="et3" style="width: 178.80pt;" width="298">Wayland</td>
</tr>
<tr style="height: 46.80pt;">
<td style="height: 46.80pt;" height="78">架构</td>
<td class="et3" style="width: 206.40pt;" width="344">传统的客户端-服务器模型，支持网络传输和远程显示</td>
<td class="et3" style="width: 178.80pt;" width="298">简化设计，去除×服务器复杂性，提高效率和响应速度，专注于本地显示</td>
</tr>
<tr style="height: 46.80pt;">
<td style="height: 46.80pt;" height="78">性能</td>
<td class="et3" style="width: 206.40pt;" width="344">由于设计老旧，性能在现代场景下不佳，依赖扩展和补丁实现现代图形效果</td>
<td class="et3" style="width: 178.80pt;" width="298">现代化设计，简化染过程，性能提升显著，尤其在动画和窗口操作方面</td>
</tr>
<tr style="height: 46.80pt;">
<td style="height: 46.80pt;" height="78">安全性</td>
<td class="et3" style="width: 206.40pt;" width="344">安全性问题明显，应用程序可以访问彼此的窗口信息，易受恶意程序干扰</td>
<td class="et3" style="width: 178.80pt;" width="298">应用程序隔离性强，无法访问其他程序的图像或输入输出，安全性高</td>
</tr>
<tr style="height: 46.80pt;">
<td style="height: 46.80pt;" height="78">可扩展性和兼容性</td>
<td class="et3" style="width: 206.40pt;" width="344">x11有非常广泛的应用支持和兼容性。<br />
许多老的应用程序和桌面环境仍然依赖于X11协议</td>
<td class="et3" style="width: 178.80pt;" width="298">逐渐被主流桌面环境支持，但生态不如x11广泛，需要兼容层运行×11应用</td>
</tr>
<tr style="height: 31.20pt;">
<td style="height: 31.20pt;" height="52">输入设备支持</td>
<td class="et3" style="width: 206.40pt;" width="344">对传统输入设备支持成熟，但在多点触控和手势支持方面不够灵活</td>
<td class="et3" style="width: 178.80pt;" width="298">优化现代硬件支持，特别是在多点触控和手势方面</td>
</tr>
<tr style="height: 46.80pt;">
<td style="height: 46.80pt;" height="78">远程桌面和网络透明性</td>
<td class="et3" style="width: 206.40pt;" width="344">支持通过网络远程传输显示内容，适合专业领域使用</td>
<td class="et3" style="width: 178.80pt;" width="298">没有×11的网络透明性，远程桌面功能有限，通常需要第三方工具</td>
</tr>
</tbody>
</table>
</div>
<section></section>
<p>总的来说，X11 作为老牌的显示服务器，拥有广泛的兼容性和成熟的生态系统。然而，其架构在安全性、性能和易用性方面存在一些局限性。相比之下，Wayland 作为一种新兴的显示服务器，其架构简化了客户端和服务器之间的通信过程，减少了潜在的安全漏洞，从而提高了整体的安全性。</p>
<p>此外，Wayland 在性能方面也有显著的优势，能够更好地支持现代显示技术，如高分辨率和高帧率的显示任务。最后，Wayland 的架构设计使得其配置和管理相对简单，用户体验更加友好，有助于吸引更多新手用户。</p>
<p> </p>
<h1 style="text-align: center;"><strong>架构设计与新窗口管理器 Treeland</strong></h1>
<p>从技术层面上，我们认为是时候更新技术方案了，曾经的 X11 + 窗口管理器 + 合成器的模式，灵活但不满足需求，而 Wayland 可通过将窗口管理器、合成器与显示系统从底层整合，提供了一种避免画面撕裂的更新机制。</p>
<p>因此 DDE 决定结合 Wayland 开发一个新的窗口管理器——Treeland。它在底层使用 wlroots 作为 Wayland 基础库，不修改 wlroots 代码，可随时同步上游进度，获得新的功能和修复。上层使用 Qt，使技术栈更统一。它专为满足 DDE 需求而设计，避免了使用第三方窗口管理器时常见的破坏性调整、同步问题和维护成本。</p>
<p><img loading="lazy" class="alignnone size-full wp-image-35319 aligncenter" src="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_173130234594.png" alt="" width="1024" height="398" srcset="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_173130234594.png 1024w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_173130234594-300x117.png 300w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_173130234594-150x58.png 150w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_173130234594-768x299.png 768w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_173130234594-24x9.png 24w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_173130234594-36x14.png 36w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_173130234594-48x19.png 48w" sizes="(max-width: 1024px) 100vw, 1024px" /></p>
<p>上图描述了 Treeland 在整体上会使用哪些项目或接口完成功能。</p>
<p><img loading="lazy" class="alignnone size-full wp-image-35320 aligncenter" src="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023525415.png" alt="" width="1080" height="661" srcset="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023525415.png 1080w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023525415-300x184.png 300w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023525415-1024x627.png 1024w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023525415-150x92.png 150w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023525415-768x470.png 768w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023525415-24x15.png 24w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023525415-36x22.png 36w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023525415-48x29.png 48w" sizes="(max-width: 1080px) 100vw, 1080px" /></p>
<p style="text-align: center;">Treeland 结构图</p>
<p> </p>
<h1 style="text-align: center;"><strong>Treeland 的技术结构与功能</strong></h1>
<section>
<section>
<section>
<section>
<section>
<section></section>
</section>
</section>
</section>
</section>
</section>
<section>
<h2><strong>1、重要项目介绍</strong></h2>
</section>
<ul>
<li>
<section>
<section><strong>QWlroots</strong>：wlroots 的 Qt 绑定，将 Wayland 信号转换为 Qt 风格信号。</section>
</section>
</li>
<li>
<section>
<section><strong>Waylib</strong>：将 wlroots 组件封装成 QtQuick 对象，使用 QPA 为 Treeland 提供事件转换与分发。</section>
</section>
</li>
<li>
<section>
<section><strong>DtkDeclarative</strong>：DTK 的 QtQuick 组件，封装大部分 DTK style 控件。</section>
</section>
</li>
</ul>
<p>在 Waylib 中，QPA 功能举足轻重。系统底层事件先进入 Waylib，转换为 Qt 内部事件发送给上层。当用户点击窗口时，Treeland 通过 Waylib 生成事件发送给客户端，完成界面交互。</p>
<p><img loading="lazy" class="alignnone wp-image-35321 aligncenter" src="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023564735.png" alt="" width="871" height="674" srcset="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023564735.png 1024w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023564735-300x232.png 300w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023564735-150x116.png 150w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023564735-768x595.png 768w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023564735-24x19.png 24w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023564735-36x28.png 36w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023564735-48x37.png 48w" sizes="(max-width: 871px) 100vw, 871px" /></p>
<p style="text-align: center;">Treeland 处理底层事件与上层事件的流程</p>
<p> </p>
<h2><strong>2、界面效果与优化</strong></h2>
<ul>
<li><strong>圆角：</strong></li>
</ul>
<p><span class="wx_text_underline">DDE 及 deepin 社区应用大量采用窗口圆角设计，Treeland 提供自己的裁圆角控件，新造型算法减少几何顶点数量和计算量，采用新抗锯齿算法提高 GPU 性能。QtQuick 圆角是由 Rectangle 组件提供的，它只能同时对四个角进行操作（红色块）。但 DTK 程序具备异形窗口的能力，所以 Treeland 提供了自己的裁圆角控件（黄色块）。</span></p>
<p>新的造型算法、几何顶点数量比 QtQuick 原生的 Rectangle 减少50%，GPU 顶点渲染和三角细分性能提升100%。</p>
<p>采用新的抗锯齿算法，提高了 GPU 片元着色器性能，相比于普通 4xMSAA 抗锯齿算法，计算量减少1/4。</p>
<p><img loading="lazy" class="alignnone size-full wp-image-35322 aligncenter" src="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023629805.png" alt="" width="256" height="253" srcset="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023629805.png 256w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023629805-150x148.png 150w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023629805-100x100.png 100w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023629805-24x24.png 24w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023629805-36x36.png 36w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023629805-48x48.png 48w" sizes="(max-width: 256px) 100vw, 256px" /></p>
<p style="text-align: center;">红色为 QtQuick 圆角/黄色为 Treeland 圆角</p>
<ul>
<li><strong>模糊：</strong></li>
</ul>
<p>QtQuick 的模糊组件仅支持对控件自身进行模糊，这并不符合 Treeland 的需求。Treeland 重新实现模糊组件，能从显存获取组件下方图像数据，使用融合模糊算法优化性能。</p>
<p><img loading="lazy" class="alignnone wp-image-35323 aligncenter" src="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023672093.png" alt="" width="714" height="417" srcset="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023672093.png 512w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023672093-300x175.png 300w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023672093-150x88.png 150w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023672093-24x14.png 24w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023672093-36x21.png 36w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023672093-48x28.png 48w" sizes="(max-width: 714px) 100vw, 714px" /></p>
<p style="text-align: center;">QtQuick 模糊控件</p>
<p><img loading="lazy" class="alignnone wp-image-35324 aligncenter" src="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023714144.png" alt="" width="734" height="426" srcset="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023714144.png 512w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023714144-300x174.png 300w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023714144-150x87.png 150w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023714144-24x14.png 24w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023714144-36x21.png 36w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023714144-48x28.png 48w" sizes="(max-width: 734px) 100vw, 734px" /></p>
<p style="text-align: center;">Treeland 模糊控件</p>
<ul>
<li><strong>阴影：</strong></li>
</ul>
<section>Treeland 使用 BorderImage 作为窗口阴影贴图，通过 ImageProvider 手动创建贴图材质，在相同大小下可复用同一份材质。</section>
<p> </p>
<p><img loading="lazy" class="alignnone wp-image-35325 aligncenter" src="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023743230.png" alt="" width="855" height="623" srcset="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023743230.png 828w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023743230-300x219.png 300w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023743230-150x109.png 150w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023743230-768x560.png 768w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023743230-24x18.png 24w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023743230-36x26.png 36w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023743230-48x35.png 48w" sizes="(max-width: 855px) 100vw, 855px" /></p>
<ul>
<li><strong>动画：</strong></li>
</ul>
<p>直接使用 QtQuick 提供的动画组件为界面提供动画效果。使用 State 和 Transition 为组件定义属性变化，例如窗口最大化和还原，两个 State 切换会触发不同的 Transition 执行属性变化，在属性变化时，使用 QtQuick 的动画组件完成动画播放。</p>
<p> </p>
<h2><strong>3、多用户功能</strong></h2>
<p>Treeland 作为解决方案的一部分，旨在实现多用户共用合成器。与传统模式相比，DDM 和 Treeland 重新设计工作流程，将 Treeland 单独抽离，用户通过相同机制将窗口画面发送给 Treeland 进行合成上屏，节省内存，避免黑屏闪烁和状态同步难题。</p>
<p><img loading="lazy" class="alignnone wp-image-35326 aligncenter" src="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023787017.png" alt="" width="831" height="559" srcset="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023787017.png 725w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023787017-300x202.png 300w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023787017-150x101.png 150w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023787017-24x16.png 24w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023787017-36x24.png 36w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023787017-48x32.png 48w" sizes="(max-width: 831px) 100vw, 831px" /></p>
<p style="text-align: center;">一个简化的 DDM 与 Treeland 的多用户登录流程</p>
<p> </p>
<h2><strong>4、与 systemd 的集成</strong></h2>
<p>DDE 的每个用户会话切换至 systemd 服务，Treeland 模式下加载单独服务为用户会话注入显示环境变量，使用 systemd 的 socket 机制懒加载，确保用户侧窗口正常显示。</p>
<p><img loading="lazy" class="alignnone wp-image-35327 aligncenter" src="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023818484.png" alt="" width="793" height="648" srcset="https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023818484.png 1024w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023818484-300x245.png 300w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023818484-150x122.png 150w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023818484-768x627.png 768w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023818484-24x20.png 24w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023818484-36x29.png 36w, https://www.deepin.org/wp-content/uploads/2024/11/企业微信截图_17313023818484-48x39.png 48w" sizes="(max-width: 793px) 100vw, 793px" /></p>
<p style="text-align: center;">多用户登录时的基本流程</p>
<p> </p>
<h1 style="text-align: center;"><strong>总结</strong></h1>
<p>深度操作系统（DDE）在窗口管理器方面的演进，从 Mutter 和 Metacity ，到 KWin ，再到我们自己的 Treeland ，展示了我们在系统架构和用户体验方面的持续创新和改进。</p>
<p> </p>
<p> </p>
<h1><strong>相关阅读：</strong></h1>
<p>（1）deepin - 国际排名查看</p>
<p>（2）深度桌面环境（DDE）</p>
<p>（3）deepin 2024 年度用户使用体验调研</p>
<p> </p>
<p> </p>
<p style="text-align: right;">内容来源：deepin（深度）社区</p>
<p style="text-align: right;">转载请注明出处</p>
<p style="text-align: right;">
</div>
頁:
[1]