h5学习笔记:nuxtjs

https://nuxtjs.org/docs/get-started/installation

趁着五一假期其实已经躺平在家,但是看到新闻Nuxtjs 3的版本已经在早一些日子公布了候选版本,离正式版不远了。在家里办公,减少了不少通勤时间,效率是提升不少,只是要做到自律就非常困难。看看书,刷刷头条,写写公众号,做做核酸检测,疫情防控成了生活常态。在广州这里,疫情也会伴随很久了。科学家还在一线奋战解决病毒的问题,希望早日有特效药,真正全球化解决这样一个病毒大流行。然后,旅游,餐饮等一些行业可以恢复起来。我也渴望后期还可以出国旅游,见识见识。

1. 一次项目交谈

在过年前,我们遇到几个朋友聚会,交流一些外贸方面的内容。他们希望构建一个网站。这个网站从事商品方面的展示。他们诉求看似简单,实际上至少有70w的数据处理。朋友对技术并不懂,他们从事外贸工作,对搜索和seo要求确要明确做到有效果。至于有效果是什么回事?
在他们的项目中,要求每天商品展示可能不一样,能提供搜索和联系方式的邮件提醒。功能其实做起来很花时间。在技术一次偶尔中,另外一个公司的用了Nuxtjs这个技术。我十分好奇,目前vuejs周边的技术其实很多,之前知道一点的是做Ssr处理很复杂,然而Nuxtjs解决了这一个问题。你只需要像平时一样写前端页面就好,剩下就交给Nuxtjs处理。这真的对seo是一个很友好的解决方案。

2. 技术调研

在查询了一些资料,得知vuejs如果做单页在直接渲染的时候对搜索引擎并不友好,然而使用者发现他关心的只是seo 不是技术本身。对于这样需求。要使用vuejs只能借助比较友好的nuxtjs。
查阅了相关资料后,Nuxtjs在3的迭代中性能比Nuxtjs前一代版本要好。之前一直处于beta版本中。身边朋友和一些公司也有使用Nuxtjs做官网。我个人是没有使用过,只是测试过程中发现写起来和Vue很友好。至于里面的坑实在没有具体深入。内存会不会占很大,部署后吃内存吗。我在搜索过程发现爱奇艺公司官网有一篇文章介绍了他们这块技术的升级和改造。看了一些介绍,也觉得不错。(哈哈。因为我只是做一个商品的首页搜索。)初期有这样意向使用这样技术解决seo的问题。这次讨论后,这个方案初步确立使用Nuxtjs作为技术首选。

3. vuejs生态阵型变化

在接触vuejs 2.0后,发现vue3的版本已经慢慢扶正。前端圈子里面出现了使用vite,webpack5,Pinia,typeScript,vueX,pnpm等等数不清的前端轮子组合正在加速刷新。无论头条,阿里,腾讯几个公司,前端轮子玩出花了。
在这里插入图片描述
这些新鲜事物,既新鲜又好玩。只是在繁杂的学习过程,在公司工作专注一样还好,在外打怪这样会跟得会有点累。只能在日后有机会慢慢过渡到3.0使用。目前只有在后台那块有使用的需求。在一些公司里面,2到3升级几乎可能性不大了,只有在新项目立项的时候确定这个技术使用就可以享受这块技术红利。毕竟目前后台并没有太多性能要求。招聘要求对vue3的要求加大招聘的难度。尽管这对已经学会vue2的人来讲并不会造成很大困扰,但是对老人来讲却会增加心智负担。
在这里插入图片描述

4. vuejs新的官网改变

可能小伙伴没发现,在vuejs新的官网出现后,我去体验了一下。真的很震撼。过去使用vuepress的时候也没有这样的感觉。实在太快了。自从有了vite的加持后,开发体验变得更加友好了。新的官网似乎加了黑科技一样。渲染体验极好。
https://staging-cn.vuejs.org/在这里插入图片描述

5. 打包保守

个人还会优先选webpack5 作为打包首选,这个开发搭配vite+rollup也是不错的选择。在前端这块,很快就会出现不同的搭配阵型。随着vite 稳定性提升。未来下一波的功能也会得到加强。但是我个人还会选webpack 打包,毕竟稳定才是商业项目首选。
在这里插入图片描述

6. 小结

五一一波后,想躺平也不行,内容已经很卷。对喜欢新鲜技术的小伙伴真的值得高兴的一件事。毕竟Nuxtjs 3正式版到来,又可以用起来了。我想到时候老的技术又被嫌弃了。但是今年vue3并不会是我们的首选目标,只不过vue3已经逐步作为首选版本推进了。我想更多要把js这块深耕一下会更加好。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值