关于 Skyline 的 N 种疑问？在这里都能找到答案！-绍兴网络公司为你呈现

自 小程序基础库 3.0.0 版本 发布 Skyline 渲染引擎正式版后，我们陆续收到很多开发者朋友们的热切反馈。每一条对 Skyline 渲染引擎 的期盼和建议我们都认真看过，我们将参考这些宝贵的意见，不断优化能力。同时针对大家关心的议题，我们整理如下 Q&A，解答大家的疑惑。

Q1: Skyline 渲染引擎稳定吗？

目前 Skyline 正式版已对外发布，在生产环境稳定运行；同时当前已有同程旅行等多个小程序接入，稳定性受到行业认可，开发者可放心使用！

Q2: Skyline 在各端的兼容性如何？

当前 Skyline 支持以下系统版本：

• 安卓 8.0.33 及以上版本（覆盖率 92.66%）

• iOS 8.0.34 及以上版本（覆盖率 88.07%）

• 微信开发者工具 Nightly 1.06.2308142 及以上版本 （建议使用最新的 Nightly 版本）

暂未支持 Windows、Mac、企业微信等系统。请各位开发者关注 最新兼容情况，及时了解更多最新情况。

Q3: 面对不支持 Skyline 的场景，开发者应该如何处理？

建议开发者使用以下方案：

• 使用推荐的 Webview 兼容方案，平台会自动将不支持 Skyline 的版本适配成 Webview 渲染

• 提高【基础库最低可用版本】，设置为 Skyline 可支持的基础库版本，但需要考虑业务是否存在较大比例的低版本用户

Q4: Skyline 有哪些最佳应用实践？

Skyline 不仅能够优化小程序性能表现，还提供多种组件能力来实现贴近原生的使用体验：

• 优化耗时：建议使用 wx.preloadSkylineView 来预加载下个页面所需要的 Skyline 运行环境，减少用户的耗时等待

• 优化长列表性能：Skyline 的 scroll-view 组件 自带按需渲染，提升长列表的渲染性能

• 实现类原生交互：为了使小程序交互体验贴近原生 App，Skyline 新增 worklet 动画机制、手势系统、自定义路由、共享元素动画 等增强特性，优化用户交互体验

• 支持多种布局方式：Skyline 默认 flex 布局，建议开发者 开启默认 Block 布局，降低适配成本
  

Q5: 平台是否提供 Skyline 开箱即用的代码片段？

平台将常见案例的代码片段集合到 案例库，同时我们也非常欢迎各位开发者贡献案例代码，让更多开发者看到你的技术影响力！

Q1: Skyline 一定需要应用到整个小程序吗？

不需要，Skyline 支持按页面粒度开启，建议开发者逐个页面适配，降低兼容的开发难度。

Q2: 切换 Skyline后，为什么某些布局被挤压？

box-sizing 默认值为 border-box，可能会导致元素空间不足被挤压。如需改成默认 content-box，开发者可在 app.json 的 skylineOptions 里配置 defaultContentBox: true。

Q3: 切换 Skyline后，如何使用 weui 组件库？

平台正在支持扩展库，预计近期上线。建议开发者使用 npm 安装 weui 组件库 后，将 node_ modules/weui-miniprogram 下的miniprogram_ dist 替换为 链接 中的 miniprogram_dist，然后在微信开发中工具中构建 npm 即可。

Q4: 切换 Skyline后，为什么顶部原生导航栏消失？

当前 Skyline 不支持原生导航栏，开发者需自行实现或使用 weui 组件库 的 navigation-bar 组件。

Q5: 切换 Skyline 后，为什么 position:  fixed 设置无效？

平台正在支持中，预计近期上线。由于 Skyline 没有全局滚动，因此在页面根节点下使用 absolute 即可达到 fixed 的效果。如果因封装导致无法移至页面根节点，可暂时使用 root-portal 组件 包裹，满足开发需求。

Q6: 切换 Skyline 后，为什么 position: absolute 相对坐标不准确？

在 Skyline 模式下，所有节点默认是 relative，可能导致 absolute 相对坐标不准。建议开发者修改节点 position 或者修改相对坐标。

Q7: 切换 Skyline 后，如何兼容 inline / inline-block？

平台正在支持中，预计近期上线。开发者可以暂时使用以下方案进行兼容：

• 通过嵌套 text 或 span 的方式实现，如 <text> foo <text> bar </text> </text>、<span><image/><text/></span>

• 单行文本修改成 flex 布局，通过横向排布达到行内文本排版的效果

Q8: 切换 Skyline 后，如何解决文本省略样式失效的问题？

针对不同文本类型，建议开发者进行如下调整：

• 单行文本：text 组件设置 overflow 属性，即 <text overflow="ellipsis"></text>

• 多行文本：除了设置 overflow 属性，需要给 text 组件的 max-lines 属性设置最长行数，例如 <text overflow="ellipsis" max-lines="2"></text>

Q9: 当 scroll-view 包含的内容较多时，为什么 boundingClientRect 无法执行？

由于 scroll-view 的直接子节点（第一层节点）是按需渲染，即直接子节点不在屏时不会渲染，无法获取到节点尺寸，因此当 boundingClientRect 通过 query.selectAll 获取时，无法立即获取节点尺寸，只有在所有节点渲染才能获取。建议开发者尝试调整为逐个获取节点的 boundingClientRect。

Q1: 在 Skyline 模式下，为什么使用真机调试会显示空白？

目前 Skyline 模式下暂不支持真机调试，建议使用真机预览完成调试，后续平台将完善真机调试能力。

Q2: 切换 Skyline 后，为什么 map / canvas / video / camera 在微信开发者工具渲染失败？

在 Skyline 模式下，微信开发者工具暂未支持调试原生组件，建议开发者使用真机预览完成调试。

Q3: 在 Skyline 模式下，为什么微信开发者工具热重载无响应？

目前 Skyline 模式暂不支持热重载，建议先关闭热重载，重新编译来预览渲染结果。后续平台将支持热重载能力。

Q1: 我希望灰度测试 Skyline 模式，应该如何操作？

Skyline 默认通过 We 分析的 AB 实验进行灰度测试，请参考 上线文档 前往 We 分析 完成灰度测试。

Q2: 我已经测试完毕，怎样全量上线 Skyline 模式下的小程序？

如果小程序无需进行 AB 实验，开发者可在 app.json 或 page.json 完成以下配置，使 Skyline 不经 AB 实验而默认打开。