在互联网行业蓬勃发展的今天，我们往往面临需求井喷的情况，如何利用有限的人力吞吐更多的业务，是我们不断追求的永恒主题。在过往，我们探索并实践过工程化、低代码化等等方案，研发效能的提升已经到达了一个平台期，那么如何进一步提升研发效能呢，这就是本次分享的主题，设计稿转代码的探索与实践。在业界已经有非常多的设计稿转代码的探索了，在本次分享中，将结合我们的具体的业务场景，分享我们在设计稿转代码上的思路和方案，以及我们遇到的问题，带领大家全方位了解如何将设计稿转换成高度可维护的代码。

演讲提纲：

1.  为什么我们需要设计稿转代码
2. 如何由设计稿生成静态代码

• 设计插件解析
• 布局还原算法
• 节点语义处理
• 字段绑定处理
• DSL 生成

3. 让静态代码拥有灵魂

• 识别设计稿中的 UI 控件
• 识别设计稿中业务组件
• 组件映射
• 逻辑库绑定

4. 业务落地场景

• 大促业务场景
• 开放式场景接入

5. 总结与展望

​你将获得：

• 了解设计稿转代码基本原理与方案
• 了解 AI 能力在前端领域的应用方向

Flutter 是一种新型的“客户端”技术。它的最终目标是替代包含几乎所有平台的开发：iOS，Android，Web，桌面，做到了一次编写，多处运行。另外在提升开发效率和严格保持跨端一致性方面尤为突出 这也是我们最终选择 Flutter 作为跨端技术的重要原因之一，那么如何通过技术手段，快速发现线上的异常，卡顿，Crash 等问题，如何量化线上性能指标，都是前端技术框架需要解决的问题，本次着重分享实践过程遇到的问题以及相关解决方案，希望能为大家提供新的思路或者启发。

演讲提纲：
1. 同程旅行 App Flutter 异常处理以及完善后指标 
2. 同程旅行 App Flutter 帧率采集以及上报处理优化 
3. 同程旅行 App Flutter Crash 治理 

• 端上收集流程 
• 上报策略以及 Crash 相关分析 
• 版本差异 Crash 兼容处理 

4. 同程旅行 App Flutter 持续构建与集成 

• 混合模式下 Flutter 持续集成 
• 业务差异化版本如何管理 

5. 一些展望和总结  

你将获得：

• 了解 Flutter 前端性能相关指标收集以及监控方案 
• 了解 Flutter 性能持续优化推进方案 
• 了解如何基于采集监控数据进行治理以及优化  

布局引擎一直是 UI 系统的核心模块之一。传统的布局引擎非常繁杂，支持了非常多的历史 CSS 属性如 table、float 等。为了支持腾讯内部的动态化框架 Hippy 和新内核 TDF，我们实现了一个新的布局引擎 Taitank。新引擎广发运用在腾讯各大 App 中。

演讲提纲：
1. 布局引擎的历史和现状
2. 构建一个完整的布局引擎

• 实现一个布局引擎
• 优化布局引擎

4. 布局工程化

• 布局引擎的工程实践
• 布局引擎的落地效果

5. 总结和展望

你将获得：

• 了解布局引擎 Taitank 的特性
• 了解一个布局引擎如何实现，并且能在基础上扩展布局引擎的实现
• 了解优化布局引擎的执行效率

Jamstack（JAM: JavaScript、API 与 Markup）是新一代的 Web 应用范式。它的最大特点是对 Web 应用的前后端实现了分离与解耦。它的前端可以是 Vue、Next.JS、Hugo、Gatsby 等工具框架编译生成的静态网页，通过共享服务器、传统云主机、CDN 甚至区块链进行部署与分发。而其后端则是由微服务或者 Serverless 函数构成，可以部署在公有云或者边缘云上。这种解耦的架构给前端开发者带来了更大的灵活度，同时增加了应用的安全性，性能，与鲁棒性。本议题将从 Jamstack 的发展历史讲起，为大家带来 Jamstack 的最佳实践。

演讲提纲：

1. Jamstack 介绍概念与应用场景
2. Jamstack 应用实战

• 使用静态网站生成工具
• 开发 Serverless API

3. Jamstack 与边缘计算

• 用 CDN 分发前端静态网页
• 用边缘云发布高性能 API

4. 用 Jamstack 构建一个边缘 AI 推理的应用示例

​你将获得：

• 了解前端发展趋势
• 了解复杂 Jamstack 的真实经验