一、ReScript: JavaScript平臺上高質量大規模程式構建的祕密武器
- 設計為js提供服務的指令碼語言
資料與函式分離
二、使用跨端方案 Rax 編寫鴻蒙應用
- 多作業系統模式都有自己的一套體系,基於大前端的思路更加高效(人工成本更低)
- vDOM是一種標準的資料結構,資料驅動UI
- 多端渲染對接方案:1、語法編譯,編譯時思路;2、執行時思路;3、底層渲染指令思路
- 多端工程構建:大前端思路下構建多webpack任務(或者多其他打包工具任務,如rollup、vite、gulp等)
構建跨端方案離不開IDE側的構建,對研發鏈路進行串聯,兜底方案可以通過Dev Server方案對接第三方的IDE
三、V8 JS AOT化的探索與實踐
- JS AOT方案:1、使用原生程式碼(機器碼,彙編),缺點:編譯慢、體積大、記憶體高、效能差、CPU架構不通用;2、全位元組碼快取,缺點:效能損耗;3、部分位元組碼快取,缺點:版本問題、CPU通用性、機型通用性
- 有效性:1、PGO(Profile-guided optimization)預釋出;2、先驗規則,預測需要被執行的程式碼,增量更新;
- 相容性:1、線上生成,① 空閒時間預熱 ② 訪問時生成;2、離線生成
移動端可做預釋出階段,為JS提供AOT的方案
四、淺談 web component 實踐與應用
Custom Element、Shadow DOM
五、解讀千萬級關係網路下的資料探尋視覺化技術
- 海量資料關係處理,使用DAGRE佈局+視覺通道對映(顏色)技術繪製節點依賴關係
- 海量資料處理方案:1、離線渲染技術,PlanUml及Offline Canvas;2、區域性渲染技術,髒矩陣渲染;3、雙引擎切換,GPU渲染
- “毛團”現象處理,圖簡化技術:1、點聚合,劃分粒度,如:下鑽訪問、互動;2、邊剪枝,減少視覺混亂,如:反向刪除演算法、Prim演算法;3、邊繫結,減少視覺混亂,如:突出邊緣模式;
- 可視分析,從業務需求角度出發,包括圖資料庫等的建立
- 可視佈局:解決通用佈局策略侷限性,使用佈局融合技術解決:1、子圖嵌入(DAGRE+GRID);2、佈局疊加:前置佈局+力導佈局+節點壓實+網路對齊+網格擴容;3、子圖融合;4、智慧佈局;5、漸進佈局
- 子圖嵌入方案:1、節點分層;2、虛擬分組;3、節點佈局;4、分組內嵌
- 圖質量分析:1、分組分析;2、地理空間分析;3、時序分析;4、演算法分析
圖產品思路:上游鏈路分析,下游影響分析
六、向量到墨水:從繪畫視角解析三維模型的漫畫風格渲染技術
CEL 動漫風格,著色器渲染:1、顏色相接(Color Differential),由色相、對比度、飽和度插值產生;2、深度斷層(Depth Fall),由深度變化的不連續產生;3、面的壓縮(Compression of Surface),由視線與物體邊緣相切程度產生
七、開源表單方案 Formily 的核心設計思路
- “資料+協議”表單框架:協議層+橋接層+應用層
- 工具類編輯器海量欄位表單渲染方案
擴充套件方案:1、屬性擴充套件;2、上下文擴充套件;3、聯結器擴充套件;4、模板擴充套件
八、協同文件工作機制簡介
- 文件模型 -> 檢視模型,無依賴contentEditable
OT及CRDT協同
九、CRDT 實時協作技術在稿定編輯器中的應用
- Event Souring機制:1、rebase機制,如:git操作;2、operation機制,如:OT(Operational Transform);3、model機制,如:CRDT(Conflict-free Replicated Data Type)
- YATA演算法,Yjs落地
- 效能優化
測試方案
十、虛擬偶像誕生記 - 數字人行業和技術探究
- 虛擬人物構建
- web3.0困境
雲渲染:Serverless、web 3d+puppeteer、非實時渲染
十一、Web端短視訊編輯器的設計與實現 - 像做PPT一樣做視訊
- 編輯器設計:通用編輯器構建,分層構建
- 視訊編輯器分層:應用層、引擎層、依賴層
- 時鐘同步、音視訊編輯碼
- 編解碼方案:1、FFmpeg+wasm;2、WebCodecs API+庫(如:mux.js)