Web组件支持两种渲染模式：

异步渲染模式（默认）
renderMode: RenderMode.ASYNC_RENDER

异步渲染模式下，Web组件作为图形surface节点，独立送显。建议在仅由Web组件构成的应用页面中使用此模式，有更好的性能和更低的功耗表现。

同步渲染模式
renderMode: RenderMode.SYNC_RENDER

同步渲染模式下，Web组件作为图形canvas节点, Web渲染跟随系统组件一起送显，可以渲染更长Web组件内容，但会消耗更多的性能资源。Web组件的宽高最大不超过500,000 px（物理像素）。

使用网页内容布局模式（FIT_CONTENT模式）或同步渲染模式（SYNC_RENDER模式）时，在出现不生效、白屏、白块、滑动卡顿、布局错误等问题时，参考以下解决方案。

场景定界

确定Web组件有没有启用组件大小自适应网页内容布局模式（FIT_CONTENT模式）或同步渲染模式（SYNC_RENDER模式）。
在IDE的过滤搜索栏中监听renderMode|layoutmode，分别对应渲染模式和布局模式。

如果renderMode和layoutMode结果都为0，则未使用组件大小自适应网页内容布局模式（FIT_CONTENT模式）或同步渲染模式（SYNC_RENDER模式）；

启用组件大小自适应网页内容布局模式（FIT_CONTENT模式）

白屏/高度未自适应页面大小

情况1：同步渲染模式未启用【建议启用】
异步渲染模式仅支持7680px的页面高度，如果不启用同步渲染模式并使用组件大小自适应网页内容布局模式，在网页高度超过7680px时，组件会使用开发者设置的高度配置，因此会出现

• 白屏->Web组件高度设置为0或Web组件设置高于7680px；
• 高度未自适应页面大小->使用Web组件设置高度，未设置则默认为100%，即一屏

情况2：Body有设置height:100vh或是height:100%样式，并且内部完全依靠网络加载的元素撑开
由于初始化时会先高度置0，导致100vh*0 = 0，然后就会导致页面直接不可见inactive。表现现象就是白屏。
验证方法：
开启devtools工具，检查页面Body有设置height:100vh或是height:100%样式。ps: devtools上删除没有用，必须修改网页。

轮播图/h5可滑动区域滑动卡顿
尝试配置如下配置，以避免父组件手势竞争

.nestedScroll({
   scrollForward: NestedScrollMode.SELF_FIRST,
   scrollBackward: NestedScrollMode.SELF_FIRST,
 })

启用同步渲染模式（SYNC_RENDER模式）

丢帧
在组件大小自适应网页内容布局模式场景下启用同步渲染模式，一般申请buffer和不启用全量展开的Web视口相比，会大很多，导致申请buffer负载大，有可能会产生丢帧的情况，需要开发者自己保障页面高度。

闪屏
同步渲染模式没有HWC(硬件合成加速)。对于有特别耗费gpu性能的css样式或其他特别耗费gpu性能的场景，通常是动画或canvas绘制的其他组件导致，举例：毛玻璃css样式：backdrop-filter，这种场景下，gpu合成重载。可能会导致出现闪屏的情况。