历史遗留的前端项目怎么改

[jiafaner]

现在的项目前端是这样的

每个 url 对应一个 view，服务器端直接 jsp 渲染出来的，用了两种前端框架，都是基于 jquery，引入几十个 js/css 文件，插件一大堆

老板让我想想办法，看看有没有办法把这种项目重构一下，引入一些现代的 web 技术，这种情况怎么处理合适

主要想解决大量复制的 css/js 在不同页面间乱引入的问题，并且希望尽量达到已有的功能尽量不变，新开发的功能逐步用新的前端架构替换掉旧的 jquery 的东西，顺便再提高一点开发效率就好了

[miao666]

老板才不关心这个，你说的那个老板是你自己吧😹

[murmur]

除非推倒，不要重构，再烂的项目通过了测试就可以了，重构后 has 要测试的

[jiafaner]

@miao666 我倒是想当老板，老板为啥不关心这个？

[jiafaner]

@murmur 项目的情况是这样的，一个老项目，03 年创建的，维护到 09 年左右，客户也不怎么用了，现在突然拿出来，说是领导重视，还能跑起来

不过说要增加很多功能，老板的意思是原来的开发模式下，我们公司没有专职前端，会花太多精力去搞那些旧的 js，有没有办法在不破坏旧系统的情况下，提高开发效率，

如果没有增加新功能，就不改过去的东西了，
如果开发新功能，有没有办法引入新的前端的东西能兼容旧代码，还能提高效率的

[zqx]

先做好 jq 插件的模块化，然后慢慢重构将每个功能(url)对应一个节点用 spa 渲染

[jiafaner]

@zqx 请教，

每个功能 url 对应的节点用 spa 渲染，那样会不会需要用 vue 初始化很多项目，一个项目对应着一个节点？

[kinghly]

搭套新的，旧的功能 iframe 内嵌进来，新功能直接开发，旧有的小改动小优化就直接改旧。

[JamesR]

如果有曾好几个 Bug 要运行 3 个月以上才能被发现并被修复，你无知地重构了，后面有得嗨了。

[JK9993]

老的可以先 requirejs 做模块化，新功能用 react/vue

[zqx]

@jiafaner
在 react 里是这样的，每个 url 是一个功能组件渲染到指定 id 节点上，如果是服务端路由的话通过监测 url 变化加载节点

[passerbytiny]

jsp 的话，没法单独对前端重构的。后端最少也要重做 Controller/Action 层。

另外在我的认识里，前端只有重做没有重构，甚至没有保持 UI 不变的重制。

[ryan1996]

原有的项目不动，新功能用新的框架写。例如 www.v2ex.com ， 你可以把新功能写在 www.v2ex.com/extends/* 下面，然后配置一下 nginx 把 extends/* 下的都定向到新功能。

[woscaizi]

把 css/js 抽到公共 jsp 中，每个 jsp 按需引入。
新功能的页面改为 vue/react，后台提供接口。

[MonoLogueChi]

JSP 没用过，但是我写 asp 基本都是在模板里引入 js 和 css，以后修改起来方便一点

[moyupoi]

老板的意思是在短时间内引入新技术重构，给你的时间不够你重写的，如果重写出问题了，你要背锅，大部分情况下还是量力而行，老板不知道重构意味着什么，也不管会出现什么问题，但你是技术，你得预估工作量，还要满足上面的需求，如果到最后为了展现实力让自己辛苦加班还不捞好，就得不偿失了…

[Dawnki]

后端改成 api 接口,前端用 react/vue 弄 spa
重构的工程量有点大,可以考虑上面评论老哥说的用 nginx 区分下新旧功能的地址,慢慢重构旧模块