js 怎样做到按需加载?

ZeronoFreya
  • 271

threejs 构建场景时需要调用的js太多,怎样按需加载?

尝试过requirejs,但感觉不太对需求。

比如 构建一种材质,需要导入大概10+个js,但这种材质不是最初就使用的(比如切换材质的展示需求)
怎样能使用时才会去加载这10+的js?

回复
阅读 4.6k
2 个回答

requirejs和 seajs都可以做到的


require(['jquery'], function ($) {
    $(function () {
        //只有用户点击了某个按钮,才动态加载knockoutjs
        $("#test").click(
            function () {
                require(['knockout'], function (ko) {
                    alert(ko.version);
                });
            }
        );
    });

原生js可以通过动态创建script标签来实现按需加载。

如果你是用react可以用react-loadable这个库来实现

import Loadable from 'react-loadable';
import Loading from './my-loading-component';
 
const LoadableComponent = Loadable({
  loader: () => import('./my-component'),
  loading: Loading,
});
 
export default class App extends React.Component {
  render() {
    return <LoadableComponent/>;
  }
}
宣传栏