很多刚入行或者接外包的朋友，一听到要建站就下意识掏出Vue或者React，觉得这样才显得高大上，技术含量高。其实对于大多数企业官网、博客或者简单的展示型页面来说，用Vue搞单页应用（SPA）纯属给自己找麻烦。今天咱们就聊聊，为什么vue做普通网站页面跳转时，简单粗暴的静态HTML或者简单的服务端渲染可能才是正解，顺便分享下我最近踩的一个坑。
上周有个老客户找我救火，说是之前找外包做的公司官网，打开速度巨慢，首屏加载要好几秒。我一看代码，好家伙，整个站全是Vue SPA，路由全靠前端JS去请求和渲染。对于这种内容更新频率极低、主要靠搜索引擎引流的网站来说，SEO效果差得离谱。百度蜘蛛爬取JS渲染后的内容，权重分散不说，还容易抓取不全。这就好比你去饭店吃饭，厨师非要把面粉烤熟了再给你做面条，你说这能快吗？
咱们来算笔账。一个标准的5页企业官网，如果用纯HTML加简单的CSS，打包后可能也就几十KB。但如果你非要用Vue CLI搭个架子，加上路由、状态管理、各种依赖库，光那个初始加载的JS文件就能飙到200KB以上。用户打开网页，得先下载这些代码，解析，执行，最后才看到内容。这在4G甚至5G网络下都显得拖沓，更别提那些还在用3G或者网络信号不好的地方了。
当然，我也不是全盘否定Vue。如果你的网站交互性极强，比如在线编辑器、复杂的后台管理系统，那Vue绝对是神器。但对于“普通网站页面跳转”这种场景，也就是点击菜单换个页面看看文字图片，SPA的优势根本体现不出来，反而成了累赘。
我有个朋友，之前也是Vue死忠粉，后来接了个政府项目的宣传页。为了赶工期，他试着用Vue做了个简单的路由跳转。结果上线后，服务器日志显示，大量的请求都在请求那几个静态资源，而真正的页面内容加载却很慢。后来他改成Nginx直接返回静态HTML，配合简单的jQuery做局部刷新，加载速度提升了至少60%。这个对比数据虽然没做严谨的A/B测试，但现场实测的感受是骗不了人的。
这里还要提一下路由配置的问题。很多新手在vue做普通网站页面跳转时，喜欢用history模式，觉得URL好看。但这需要服务器端做额外的配置，比如Nginx的try_files指令。一旦服务器配置出错，刷新页面就404。对于不懂服务器运维的客户来说，这就是个定时炸弹。相比之下，hash模式虽然URL里有个#号，丑了点，但稳定性高，不需要服务器特殊配置。不过，对于SEO来说，history模式配合SSR（服务端渲染）才是王道，但SSR又增加了开发和维护成本。
所以，我的建议是：如果你的网站内容主要是图文，交互少，别折腾SPA了。直接用静态生成工具，比如Hexo、Hugo，或者甚至就是手写的HTML。如果非要用Vue，考虑一下Nuxt.js这样的SSR框架，但前提是你要清楚自己在做什么。
另外，别忽视图片优化。很多页面慢，不是因为JS太大，而是因为图片没压缩。用TinyPNG或者在线工具把PNG转成WebP格式，体积能缩小一半以上。这点小细节，往往比换什么前端框架都管用。
最后想说，技术选型没有银弹，只有最适合。别为了用技术而用技术，客户要的是快、稳、好收录。你写一堆复杂的代码，最后用户打开还是慢，那这代码写得再漂亮也是白搭。记住，简单的才是高效的。
本文关键词：vue做普通网站页面跳转
