vite构建的项目开发环境页面首次加载慢如何解决?_前端知识库

PHOTO EMBED

Wed Jan 10 2024 02:51:58 GMT+0000 (Coordinated Universal Time)

Saved by @yangxudong

const fs = require('fs')
// 查找文件
function getFiles (e: string) {
    const arr: string[] = []
    const dirents = fs.readdirSync(e, { withFileTypes: true })
    for (const dirent of dirents) {
        if (dirent.isDirectory()) arr.push(...getFiles(e + dirent.name + '/'))
        else {
            arr.push(e + dirent.name)
        }
    }
    return arr
}
// 插入加载文件脚本
export const setPreLoadFile = (options: { pathList: string[], preFix: string } = { pathList: [], preFix: '' }) => {
    if (options.pathList && options.pathList.length) {
        let res: string[] = []
        options.pathList.forEach(path => {
            res = res.concat(getFiles(path))
        })
        let linkStr = `
        <script>
        setTimeout(() => {
            function preLoadSource(url){
                var xhr = new XMLHttpRequest();
                xhr.open('GET', url);
                xhr.onload = function() {
                    if (xhr.status === 200) {
                        console.log('预加载成功');
                    } else {
                        console.error('预加载失败');
                    }
                };
                xhr.send();
            }\n
        `
        res.forEach(item => {
            linkStr += `preLoadSource('${options.preFix + item.substring(1)}')\n`
        })
        linkStr += '})\n</script>'
        return {
            name: 'preload-file',
            transformIndexHtml (dom) {
                return dom.replace('</body>', `${linkStr}</body>`)
            }
        }
    }
}
content_copyCOPY

https://frontend.devrank.cn/traffic-information/7229359769553766456