在微信开发ide工具-调试器-Audits面板进行跑分并优化:
如下代码发现个性能问题:
<checkbox-group class="group" bindchange="checkboxChange">
<view wx:for="{{checkboxItems}}" wx:key="index">
<label class="option">
<checkbox hidden value="{{item.name}}" checked="{{item.checked}}" disabled="{{isShowAnswer}}">
</checkbox>
<view class="option-checkbox-out">
<mp-icon extClass="option-checkbox-in" type="outline" icon='done' color="green"
wx:if="{{item.checked}}" size="{{26}}" />
<mp-icon extClass="option-checkbox-in" type="outline" icon='close' color="red"
wx:if="{{item.resulted}}" size="{{26}}" />
</view>
<text class="option-text">{{item.name}}、{{item.value}}</text>
</label>
</view>
</checkbox-group>
性能问题:
{
"maxDepth": 11,
"maxDepthNode": "checkbox",
"totalNodeCount": 253,
"maxChildren": 100,
"maxChildrenNode": "view.contentIndex--content-inner",
"page": "pages/xxx/xxx"
}
说checkbox子节点数有100个,但是不建议大于60个。但是代码中看不出子节点有100个?
请教下怎么优化?
指向它,但罪魁祸首不一定是它,看maxDepth等于11,外面是不是还有很多节点?
刚好有个答题项目要做,能不能加个v,我有问题要请教一下。zhengchao115203
分页
可能是你题库生成的节点太多了,保证当前页面节点只渲染当前题的内容节点。
控制台的wxml看下有多少节点就好了,很好排查。