很长一段时间,我一直在与自己辩论,如果这真的是StackOverflow要问的问题 . 但是,由于我正在处理的障碍,我相信它可能只是其他人从基于PHP的框架迁移的东西时不时地面对 .

对于某些上下文:基于PHP的框架在服务器端进行路由,控制和建模,并且基本上只返回HTML页面 . 在Yii 1的早期,我们只生成一些基本的jQuery代码,可以在客户端执行输入验证等操作 . 但是,那时候,JavaScript并没有像今天那样“成长”,像ES6这样的东西和ES7的提议就在身边 . 更别说 - 当时Node并不是那么大的玩家,或者实际上根本不是 .

我有一些个人需要照顾的事情,因此我的时间差距很大:三年 . 在这段时间里,发生了很多事情,WebAssembly从一个起草阶段出来,现在被各种各样的地方采用,实际上非常实用 . ECMAScript已经消除了JavaScript开发人员的超级旧形象"just a script kiddie" - 而今天,ECMAScript是最先进的时期 . 因此,在Web开发中,似乎大多数事情都是在JavaScript中主要完成的,并且这可以通过像React,Angular和类似的框架来提升(尽管,考虑到Angular非常庞大,我没有在一会儿) .

那时候,我刚刚从Yii 1中走出来并开始与Laravel合作 - 但我需要WebSockets支持,并且正在扩展我的应用程序的概念和基本思想 . 当我躺在医院时,我继续这些并得出结论:PHP在这个项目中没有帮助,但实际上是一个巨大的障碍 . 因为我想创建一个面向微服务的后端,这在NodeJS中显然比PHP更好 - Node似乎只是“天生”完成这项任务 . 好吧,当时它实际上被宣传为服务器端后端创建平台 - 而且根本不限于网络开发 . 同时,PHP真的是......

现在,回到现在:在过去三个月里,我试图围绕像React和Vue这样的几个框架 - 以及Preact之类的其他框架(因为React在文件大小中太大了,甚至是gzip,在我的意见)或骚乱 . 基本上,我正在寻找解决我的头脑无法理解的问题:为什么我必须在客户端渲染?嗯,显然我没有 - 服务器端渲染得到React和Vue以及甚至像Hyperapp这样的小型框架的支持 . 使用WebPack,我甚至可以使用ESNext的功能,Node不支持,简洁的Babel的env-preset . 但是这仍然给我留下了一些需要解决的重要线索:如果我在服务器上渲染,并将其发送给我的客户端,我怎样才能编写与之正确交互的JavaScript?

第一种选择是采用服务器端生成的状态并将其呈现为传出的HTML,并从中获取等效的框架并继续服务器离开的位置 . 优点:我可以完美地重用两端的组件和程序逻辑 . 这听起来不错......直到我意识到,每当用户浏览时,我都必须重新加载整个站点,因为服务器会真正创建一个全新的状态,必须在客户端知道 .

第二个选项:通过WebSockets推送该状态 . 是的,它在我脑海中浮现,但同样快速地消失了 . 我相信我不需要解释为什么,对吧? :)

第三种选择:使用PJAX并仅重新加载 . 这样做的好处是,客户端只需要下载新呈现的HTML并将其修补到DOM中,从而有效地保留当前内存,并且脚本仍然加载 . 问题:我无法将JavaScript放入PJAX获取的输出中,因为我不能完全从PJAX元素中删除脚本 . 因此,我可以为WebPack中的每个页面创建一个入口脚本,并使服务器与PJAX数据一起向客户端发送一个额外的标头(如 X-Controller: /js/controller.js ) . 从那里,客户端可以只是动态地将该控制器添加到页面,或者如果它已经加载则重新实例化它 . 这听起来很不错,但是,这提出了一个难以解决的难题:当我编写一个WebPack配置,它会发出一个包含核心依赖关系的公共块,并将其包含在基本布局中 - 就像运行时库一样 - 我仍然会必须知道每个生成的输出的确切路径 . 这可能是通过让服务器找到并用 records.json 中的WebPack发出的值替换 <script> -tags来实现的 . 但是这在开发过程中基本上会破坏,因为我无法使用热重新加载 - 并且会破坏使用像WebPack这样的高级软件包捆绑器的目的......所以:我根本无法编写任何内联javascript . 所以,我无法在后端使用Vue,因为Vue的 <script> -tag中的脚本将被渲染到网站中 . 我应该暴露全局变量吗?不,我不能 - 因为在 生产环境 过程中,Terser WebPack插件可能会消除这些内联脚本可能使用的一些功能!所以我必须拿起每个函数调用并将那些函数标记为不被删除 - 就像C中的 volatile 一样,基本上(我在C中不太好,老实说) .

所以,我真的想要使用第三个选项......因为它允许我模仿我从PHP使用的基本行为,甚至允许优化的加载速度,因为只有页面的内容会在点击时重新加载利用 pushState . 但与此同时,我必须跳过很多环节才能使其正常工作 .

为什么我如此关注并且不需要编写大量客户端代码,因此React或Vue等框架的成本基本上是巨大的 . 在我看来,太过分了 . 我知道,从经验来看,到处都没有带宽带宽的优质互联网 - 特别是在移动设备上 . 我甚至没有使用过 . 因为尽管通过Terser和WebPack进行树木震动非常酷,但由于副作用代码,它到目前为止还没有被束缚到"always work" . 喜欢: obj["mtd_" + mtdName]() . WebPack和Terser无法准确地告诉究竟将调用什么,因此整个 obj 将留在代码中,即使只使用了一小部分 . 所以我最终可能会得到一大堆JavaScript,其中我只能使用一小部分 .

这就是为什么我想尽可能地像香草一样,尽可能地服务于服务器 . 服务器不需要下载任何东西 - 我只需要在我的机器中拥有良好的RAM和CPU - 并且可能具有良好的HDD读/写速度 - 我需要担心 . 我非常批评我要发送给客户端的字节数 - 我希望尽可能低 . 事实上,我遇到的每个框架都通过bundlephobia进行了检查 .

所以 - 简单地描述我的问题: - 我想在我的服务器上完全呈现并在用户访问另一个站点时通过PJAX传输更改 . - 我希望能够为表单验证和其他事情编写小的JavaScript,并且可能利用通过WebPack收集的依赖关系,这些依赖关系存在于加载了基本布局的JavaScript包中(毕竟我必须在某处处理PJAX) .

这就是我真正被困在的地方 . 如果有人建议我如何能够绕过这个障碍并最终实际编写我的应用程序,我会很高兴听到这个 . 我以前在几个论坛上问过,但遗憾的是没有回答......这也是我决定放弃这个的原因 . 此外,也许另一个涌入JavaScript的PHP开发人员可能遇到类似的障碍,他们非常喜欢服务器端MVC的想法,只是在客户端上使用一点JavaScript,并通过Node提供其他一些服务 . 不知道如何解决MVC中的V问题 .

提前谢谢你,特别是在阅读了所有这些之后:)