推广 热搜: 分享  是什么意思  改变  还是  阅读  好处  语文  说话  经典  财报 

Turbopack似乎并没有那么牛

   日期:2024-11-18     作者:caijiyuan    caijiyuan   评论:0    移动:http://sicmodule.glev.cn/mobile/news/784.html
核心提示:这几天前端圈子有一个比较火的基建工具Turbopack,官方文档号称比vite快10倍,比webpack快700倍。今天正好有空,把官方提供的dem

Turbopack似乎并没有那么牛

这几天前端圈子有一个比较火的基建工具Turbopack,官方文档号称比vite快10倍,比webpack快700倍。今天正好有空,把官方提供的demo浅玩了一下,发现它并没有那么神。

image-20221027223245550

Turbopack目前还处于阶段,暂时只在next 13中提供了支持,按照官方文档所述,我们只需执行如下命令即可完成项目的初始化。

image-20221027223756134

一切准备就绪后,我们打开项目,执行package.json中的指令,即可启动项目。

本以为会很顺利,但是它报错了。

image-20221027224023436

在next仓库的issue区域找到了这个问题的解决方案,原来是我的node版本不对,他要求node版本必须是16,我本地的版本是14。

image-20221027224321930

当我把node版本改为之后,项目终于成功启动了。

image-20221027224607692

image-20221027224625952

项目启动的速度是挺快的,只需要几十毫秒,首屏加载也很快,但是当我在页面上切换菜单时,发现它卡卡的,如下述视频所示。

http://mpvideo.qpic.cn/0bc3hmaiwaaagmac2kk2wvrvao6drm5qbcya.f10002.mp4?dis_k=b4a823caaaf8c2f5387647818ab3c67b&dis_t=1673263777&play_scene=10400&vid=wxv_2638936246593224705&format_id=10002&support_redirect=0&mmversion=false

看了下控制台打印的日志,发现响应时间确实有点长。

image-20221027230226728

执行package.json中的build指令,即可将项目打包。

image-20221027225518481

打包成功后,执行start指令,即可启动项目。

项目启动后,我们再来试下菜单栏切换时的响应速度,发现它很丝滑,感受不到一丁点卡顿,如下述视频所示:

http://mpvideo.qpic.cn/0bc36maiuaaarmaczyc2wrrvb46drlzqbcqa.f10002.mp4?dis_k=604b35a7f8c2999f75b39d3e8ae9d53b&dis_t=1673263777&play_scene=10400&vid=wxv_2638938117907120128&format_id=10002&support_redirect=0&mmversion=false

整体使用下来,感觉它在dev环境下运行时,即时编译的速度并没有惊艳到我,路由切换时还是卡卡的,很影响开发体验,我还是继续用webpack吧。希望正式版本发布时,这个响应速度可以更快吧。

本文所创建的项目已上传至GitHub,需要的开发者可自取:

注意:项目中我用了Volta作为包管理工具,对此感兴趣的开发者可移步我的另一篇文章:强大的Javascript工具管理器Volta

至此,文章就分享完毕了。

本文地址:http://sicmodule.glev.cn/news/784.html    歌乐夫 http://sicmodule.glev.cn/ , 查看更多
 
标签: 并没有 那么
 
更多>同类行业资讯
0相关评论

新闻列表
企业新闻
推荐企业新闻
推荐图文
推荐行业资讯
点击排行
网站首页  |  关于我们  |  联系方式  |  使用协议  |  版权隐私  |  网站地图  |  排名推广  |  广告服务  |  积分换礼  |  网站留言  |  RSS订阅  |  违规举报  |  鄂ICP备2023001713号