codecamp

性能优化选项

如果存在对性能要求很高的页面,可以通过配置 turboPages 选项对某些页面启动性能优化。如:

// remax.config.js
module.exports = {
turboPages: ['pages/index/index', 'pages/index2/*'],
};

上述配置将会对 pages/index/index 以及 pages/index2/ 下的所有页面做性能优化。

启动性能优化存在如下限制,建议没有很迫切的性能需求不要轻易开启这个选项。

  1. 目前只支持 支付宝 平台使用。
  2. 开启性能优化的页面,不能利用 react 动态特性 对 dom 结构做出修改

关于第二点限制的一些 case:

  1. 修改 dom 结构:
function Component({ children }) {
return <View>{React.Children.map(children, child => (
<View>{child}</View>
))}</View>
}
...
<Component>
<View>view 1</View>
<View>view 2</View>
</Component>
  1. 修改 dom 的属性:
function Component({ children }) {
return <View>{React.Children.map(children, child => (
React.cloneElement(child, { onInput: () => {} })
))}</View>
}
...
<Component>
<Input />
</Component>

如果你想让这种修改属性的行为可以运作,需要修改为:

function Component({ children }) {
return <View>{React.Children.map(children, child => (
React.cloneElement(child, { onInput: () => {} })
))}</View>
}
...
<Component>
{({ onInput }) =>
<Input onInput={onInput} />}
</Component>

可以看到优化性能的同时会牺牲 React 的动态性,因此开发者需要做出取舍。


Remax 实现原理
常见问题
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

跨平台开发

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }