使用JavaScript或TypeScript加载资源（JavaScript、CSS、图像）的最简单方法。Web应用程序通常使用第三方API来提供应用程序特定路由上的功能，其中许多功能很重，并且在NPM上没有可用的包。在Web应用程序上添加这些API的通常方法是将其添加到主HTML文件中，使用这种方法会极大地影响页面加载时间。例如，如果它是一个JavaScript文件，它会下载、编译并执行脚本。如果我们可以避免在页面首次加载时加载这些API会怎么样？这将有助于更快地加载页面内容，减少整体网络数据使用量，并降低低端设备上的内存使用量。LoadxAPILoadxAPI将通过以下方式帮助我们异步加载资源：加载JS、CSS或图像缓存结果??Promise和async/await的出色实现?压缩后的ES3只有400字节让我们使用此API创建一个示例：importloadxfrom'loadx';asyncfunctiongetUser(){//loadAxiosAPIawaitloadx.js('https://cdnjs.cloudflare.com/ajax/libs/axios/0.19.2/axios.min.js');//从RestAPI获取用户returnaxios.get('/user/12345');}asyncfunctionloadImage(url){//图像容器constcontainerEl=document.querySelector('.container');//loadingspinnerconstspinnerEl=document.querySelector('.spinner');if(containerEl===null||spinnerEl===null){thrownewError('Imagecontainernotfound')}//showthespinnerspinnerEl.style.diplay='block';//加载图片awaitloadx.img(url,containerEl);//隐藏spinnerspinnerEl。style.diplay='none';}functionloadCSSFramework(){//simpleloadTailwindCSSloadx.css('https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css');}end现在，只资源只能在需要时加载。试一试！
