对话框

// 通过 create API 创建一个对话框，主要为了能够全局的控制对话框的展现
const UserInfoModal = NiceModal.create(
  'user-info-modal',
  RealUserInfoModal
);

// 创建一个 useNiceModal 这样的 Hook，用于获取某个 id 的对话框的操作对象
const modal = useNiceModal('user-info-modal');
// 通过 modal.show 显示一个对话框，并能够给它传递参数
modal.show(args);
// 通过 modal.hide 关闭对话框
modal.hide();

16 | 按需加载：如何提升应用打开速度？

• 使用 react-lodable，实现组件的异步加载，不过 react-loadable 已经不维护了
• @loadable/component 支持 lib 级别的代码切分，React.lazy 还不能支持。

import loadable from '@loadable/component'
const AsyncPage = loadable(props => import(`./${props.page}`))
function MyComponent() {
  return (
    <div>
      <AsyncPage page="Home" />
      <AsyncPage page="Contact" />
    </div>
  )
}

1. 合并请求接口
2. 使用OSS服务加载图片资源
3. 制定编码规范、提取公共组件、减少重复代码