5G時代即將來臨，IoT是5G時代一個重要的場景之一。應該以什麼姿態和角色去迎接新的技術變革，是每個端開發需要思考的問題。
淘寶技術是新零售的踐行者之一。我們曾在線下零售，工廠製造中嘗試過包括WebView、Hybrid、純Native在內的多種技術方案，以求在渲染性能、動態性和開發效率中取得平衡，但效果差強人意。因此，淘寶渲染技術團隊在Flutter的Native引擎基礎上，建立了一套基於TypeScript的，擁有2D/WebGL/WebGPU能力的可編程自定義的UI渲染管線。
本次分享將會以渲染技術團隊在IoT零售中的實踐作爲起點，詳細介紹新的UI渲染管線的原理和實現，包括自定義渲染管線關鍵實施步驟、引擎中實現的核心技術、跨平臺移植的一些細節等內容。希望對關注渲染技術的端側與會者帶來思路上的拓展和幫助。
演講提綱：
1、IoT時代前端面臨的問題
- 5G時代概述
- 嵌入式設備的開發現狀，以及正在發生的變化
- 面臨的問題
開發成本和效率問題
技術引發的動態性問題
WebView方案因性能帶來的成本和體驗問題
2、炙手可熱的Flutter
- 簡介
- 原理簡介
- 生態問題
3、"G"項目介紹
- 目標定位：使用TypeScript，且擁有Canvas/WebGL/WebGPU能力，可高度定製渲染管線，擁有完整工具鏈的跨端跨平臺高性能渲染解決方案
- 技術特點：Flutter引擎+TypeScript+GCanvas
- 框架簡介
- 渲染管線整體流程概述(TypeScript的部分是自定義渲染管線，其餘部分歸爲引擎)
4、自定義渲染管線詳解
- 樹的創建
- 佈局和測量運算
- 繪製
- 渲染
- 視圖緩存
- 輸入輸出
- 狀態更新
5、引擎詳解
- 跨平臺概述
- 線程模型
- Skia能力概述
6、工具鏈簡介
- 如何實現全鏈路Debugger
7、GCanvas和2D/WebGL/WebGPU能力
8、展望和總結
- TypeScript Runtime
- CSS怎麼支持
聽衆收益：
1、可以瞭解IoT時代端側開發面臨的具體問題
2、可以瞭解瀏覽器以及Flutter在內的類W3C渲染體系的完整工作鏈路和原理
3、爲業內提供解決IoT渲染問題的新思路