抖音开放平台Logo
开发者文档
“/”唤起搜索
控制台
  • 开发教程与代码示例
  • 入门
  • 小程序框架
  • 框架概述
  • 逻辑层
  • 视图层
  • 小程序运行时
  • 自定义组件
  • 基础教程
  • 能力教程
  • 性能优化
  • 安全
  • 概述

    收藏
    我的收藏

    简介

    “小程序Lynx 渲染引擎” 是抖音小程序侧推出的基于原生 UI 的高性能渲染方案。在保持极致性能体验的同时,对齐小程序标准规范,即开发者可以继续沿用 TTML、TTSS 和 JavaScript 开发方式,按页面逐步接入,即可达到更快的打开速度、更稳定的功能体验。与线上已有的渲染类型区别是
      •小程序 Lynx 渲染方案:基于原生 UI 的小程序渲染框架。
      •小程序 WebView 渲染方案:基于 Web 技术的小程序渲染框架,即 Lynx 推出前小程序使用的渲染框架。

    前提条件

    Lynx 渲染复用小程序的上层开发方式,但并不完全等同于 WebView 的开发。接入时需要检查框架、组件、API 和样式的支持范围,并对存在差异的部分进行适配。如果是针对线上已有小程序进行迁移,也可以先迁移单个页面,再根据验证结果逐步扩大范围。
    接入前请确认客户端、基础库和开发者工具满足版本要求,并检查页面依赖的能力是否受支持。环境要求见“快速开始”。
    抖音客户端
    版本:39.8.0
    基础库
    版本:>= 4.25.0
    开发者工具
    4.5.7 及以上版本,下载地址
    ​

    目标

    极致的性能和稳定性:采用 Lynx 高性能渲染机制,有效解决加载慢、白屏等体验瓶颈。线上场景数据验证,部分业务接入后核心体验指标(如 LCP / FMP 耗时)优化幅度超过 20%,启动到达率和业务指标也能得到提升。

    渲染方式

    以页面配置类型区分,WebView 页面由 WebView 承担页面渲染。Lynx 页面由 Lynx 引擎处理页面元素和样式,并使用客户端原生渲染能力展示界面。两者面向相同的小程序业务开发场景,但底层渲染实现和部分行为不同。
    开发层次
    Lynx 小程序中的职责
    业务开发
    使用 TTML 描述结构、TTSS 描述样式、JavaScript 实现业务逻辑。
    小程序框架
    提供 Page、Component 和小程序组件、API 等开发接口;迁移注意事项见“从 WebView 迁移”。
    页面渲染
    在支持条件满足且页面启用 Lynx 时,由 Lynx 引擎承担渲染。
    Lynx 引擎文档可以帮助理解原生渲染和样式模型,但不代表其中的全部能力都已向抖音小程序开放。小程序的组件、API、配置和版本要求,以小程序接入说明为准;不要直接把 ReactLynx 的项目配置或 API 用于 TTML 小程序。
    ​

    Lynx 小程序特性

    Lynx 小程序在沿用 TTML、TTSS 和 JavaScript 开发方式的基础上,提供原生渲染、高性能列表等能力,帮助开发者构建更接近原生应用体验的小程序。开发者可以按页面逐步接入,并通过 WebView 兼容方案覆盖不支持 Lynx 的运行环境。

    原生渲染

    Lynx 页面由 Lynx 引擎处理页面元素、样式和布局,通过客户端原生渲染能力展示界面,为小程序提供 WebView 之外的渲染方案。view、text 等基础组件由原生节点承载,滚动、轮播等交互组件也结合原生实现,为页面展示和交互体验优化提供基础。

    高性能列表

    Lynx 小程序通过 scroll-view 的 type="list" 模式和 list-item 提供高性能列表能力,适用于商品列表、信息流等包含大量重复内容的页面。
    原生列表根据需要创建和挂载列表项节点,并支持同一逻辑项回收后的节点复用,避免一次性挂载全部列表项。开发者可以结合列表项高度或尺寸估算,优化动态内容场景下的布局与滚动表现。
    高性能列表还支持列表项吸顶,便于构建分类标题、分组导航等交互。具体结构和布局约束见“高性能列表”。

    延续小程序开发方式

    Lynx 小程序继续使用 TTML 描述页面结构、TTSS 编写样式、JavaScript 实现业务逻辑,并沿用 Page、Component 等开发接口,便于复用现有业务代码与开发经验。
    同时,开发者可以继续使用已支持的小程序开放能力,例如分享、获取手机号和客服能力。迁移主要围绕框架、组件、API 和样式差异展开,不需要重新学习一套业务开发语言。

    渐进接入与低版本兼容

    开发者可以为指定页面启用 Lynx,也可以在应用配置中统一设置渲染方式。已有项目可以先选择有明确体验优化需求的页面进行迁移,完成验证后再逐步扩大范围。在不满足 Lynx 支持条件的运行环境中,小程序可回退为 WebView 渲染。开发者还可以设置 Lynx 生效的基础库版本门槛,结合业务所需能力制定兼容策略。
    需要覆盖低版本用户时,应同时验证 Lynx 和 WebView 两条渲染路径,并为 Lynx 专属能力保留兼容实现。自动回退负责选择渲染方式,不会自动转换不兼容的业务代码。

    开始使用

    首次接入请阅读“快速开始”,完成一个页面的配置与真机验证;需要优化长列表时,阅读“高性能列表”。