另外捎带个项目,golang 高性能、功能丰富的网络交互 /RPC 框架 ARPC
因为本来是想写点前端的项目辅助宣传 ARPC 的,但是迫于前端学不动,并且从理论上讲,react 、vue 那些最终还是原生、虚拟 dom 也不可能比高手写的原生性能好,所以写了 pm.js ,不求为前端社区做出多大贡献,但愿能给道友们带来一些新的思路、简化工程、保住秀发
- html 主页面包含一组空 dom 元素,非默认显示页的 dom 元素设置隐藏( display: none )
- 使用 pm.js 根据配置绑定这组 dom 元素的关联关系,按照实际子页面的显示时机比如 $pm.select(dom id),同步或异步加载该 html 子页面作为主页面的 dom 元素内容
- 通过 style.display 属性控制不同子页面元素的显示或隐藏,只有当前页面被显示、其他页面被隐藏
2 lesismal 18 天前看来大家都去搞 react 、vue 了,没人关心 native 了 😂 |
4 lesismal 18 天前@Kasumi20 如果业务层觉得有必要,完全可以自己使用路由。只是使用 pm.js 的方案不需要使用路由,并且通常没有必要,这在 GUI/H5 GAME 领域很常见。 |
5 shunia 18 天前 |
6 lesismal 18 天前@shunia 我不知道我理解的路由是否正确,如果说的不准确,多多指正。 如果你理解成对标 react 、vue,那么对标的部分我是指它们的虚拟 dom,因为最终都是操作 native,所以如果 native 实现方案合理,react 、vue 并不会比 native 性能更高。 “go 多好啊” —— 严重同意,所以我也不是折腾 js 后端,只是捎带一点前端思路 |
7 lesismal 18 天前@shunia redux 这种,核心本质就是事件分发数据驱动,但是它搞得太复杂了。所以前端社区学不动,甚至很多非前端的老司机想搞下前端都忽觉门槛奇高,这于工程性不够友好。 虚拟 dom 系的新栈最大的好处是强行提高了门槛,强行约束了工程规范,虽然依旧是屎山,但是不是什么样子的小白都能爬上山了,所以现在这些山上的人们,至少做事能力靠谱了很多,而且在这山上再能制作出很漂亮的前端产品,确实是值得肯定的,因为比用 go 写一些基础业务还是要难度大很多的。 |
8 otato 17 天前你这个其实就是个路由嘛,或者说加载器,功能感觉够了,安心当个路由吧。 每个页面里面的逻辑简单的就写原生,稍微复杂一点的用 vue 完整版(带模板解析器的,直接就可以在页面里写不用 build ),或者其他什么框架,再复杂的还是得上前端那一套。 虚拟 DOM 的性能,就是在 js 里对比一下,不操作 dom,不占多少时间,最后 diff 算法算出来的实际 DOM 操作,基本就是最优解。现在直接大段 innerHTML 确实性能最好,但是再细的粒度呢,要么使用者手动去操作 dom,要么你实现个中间层,可是,这个中间层,不也就会是个虚拟 DOM 么 23333 事件系统建议就用在页面间传数据或者跟主程序通讯,发布 /订阅模式适合做底层不适合在业务中全面使用。 |
9 lesismal 17 天前“你这个其实就是个路由嘛,或者说加载器,功能感觉够了” —— 定义不一样也不那么重要,但是要实现的功能是类似的,这个方案并不是以 web 为出发点的来做的,而是以 GUI 为出发点捎带着给 web 领域的。浏览器本身是在 GUI 系统之上发展起来的一套复杂姿势,但 GUI 领域比如桌面、游戏引擎,都相对规范得好一些、没有 web 领域这么繁杂松散 “虚拟 DOM 的性能,就是在 js 里对比一下” —— 这个说法不够详细,不知道兄弟你的意思是对比单个 dom 还是整个 dom 树,我没有读过 react 、vue 的源码、不确定它们的实现方案。如果我自己实现虚拟 dom,我不会去实现管理整个 dom 树所有节点,只会去按照初始化后触发修改才去把相应的 dom 元素加到管理列表,每次触发修改也只对比这个元素自己然后更新 “”现在直接大段 innerHTML 确实性能最好,但是再细的粒度呢“ —— 这个理解是不准确的,直接大段只是加载子页面时一次性 load,不是每次有 dom 元素变更都需要 reload 大段 “”要么使用者手动去操作 dom,要么你实现个中间层,可是,这个中间层,不也就会是个虚拟 DOM 么 23333" —— 手动操作 dom 是对的,不需要另外实现个中间层、虚拟 dom 是有些多余的 ”事件系统建议就用在页面间传数据或者跟主程序通讯,发布 /订阅模式适合做底层不适合在业务中全面使用。 |
10 lesismal 17 天前@otato pm.js 原理和实现都很简单,不是什么高深的玩意。只是我想做些页面,选用一些 UI 框架时看到的一些工程示例,比如 github 上数万 star 的 bootstrap admin 模板项目,dashboard 切换功能标签时是 url 路由到新页面、每次都全部重新加载,性能损失太亏了。 |
11 lesismal 17 天前@otato 我不是 web 前端工程师,也不太了解前端社区特别好的解决方案细节、只是偶尔了解一点。想做一点页面,但是 react 、vue 这些需要更多时间熟悉它们的基础,想直接原生搞,然后原生的框架没有找到我满意的姿势(自己对性能有些强迫症),就搞了 pm.js 这么个,简单归简单,但是工程性在架构分层的不同层里,每一层处理好自己的只能就好,pm.js 是 Page Manager 的意思,如果是我自己用我会理解成 Project Manager,因为在 pm.js 管理页面基础上的工程结构,再加上动态 dom 元素的事件绑定和动态更新,另外找一套漂亮的 UI 框架,基本就足够了(可能还有一些其他细节比如 i18n 国际化之类的不赘述) 代码层面的工程管理本身并不需要太多东西,只是被有的人有的社区搞得有些过于复杂甚至华而不实,学起来头大用起来繁琐,虽然也是一种工程规范,但本来可以搞得简单些,就像独孤九剑,我不想玩花架子 :joy::joy: |
12 lesismal 17 天前@otato 所以 react vue 这些没火起来以前的 web 前端薪资水平比后端低很多 |
13 shunia 17 天前首先你这个东西主要针对单页面,那就不要对标需要加载页面的情况。非 SPA 有各种存在的原因,比如说如果要考虑 SEO,多页面就比单页面方便很多。 ‘虽然依旧是屎山’ 你写你的框架,我写的 Javascript 屎山关你屁事?在这强行提高自己自高 go 干嘛呢,当自己是 Linus ? 你可以不想学 Javascript 世界的新东西,这没问题,但是既不去了解,也不做客观的比较,匪夷所思。 |
14 lesismal 17 天前也很早就有使用 history —— 这个我不懂,但是它是否需要重新渲染页面?如果不需要,那性能没什么损失,还好 redux 之类的,你觉得简单已经学会,不代表大多数人的感受。我的观点也不能代表所有,但是至少我是这样的感受,并且包括 node 之父自己的一些观点以及 deno 刚出来时候有成都小伙去炸 issue 的时候,或者说现实世界里的前端同事也很多这种感受的。 ‘虽然依旧是屎山’ 你写你的框架,我写的 Javascript 屎山关你屁事 —— 我说是屎山,这个是否定早期的前端技术栈,并不是否定写前端的人,我原来的描述里也说了,能把前端做好的确实是值得肯定的。也没有强行提高 go 你可以不想学 Javascript 世界的新东西,这没问题,但是既不去了解,也不做客观的比较,匪夷所思。 —— 我写出来的都是自身感受,如果理解不到位,多指教、交流就可以了 但是,淡定点,聊个技术,不要逮到个字眼就随便自己臆测出别人存在恶意或者曲解别人的含义,气大伤身 |
15 otato 17 天前提供单页面方案或者工程性的基础,这不跟我一个意思嘛 |
16 lesismal 17 天前“提供单页面方案或者工程性的基础,这不跟我一个意思嘛” —— 对的,就是这个意思 “接下来不是跟你抬杠,只是有些问题你理解错了,首先真没 native 这个说法” —— 我也不确定,不常混前端社区,只是看到有人这么说,以为传统的非 react 、vue 就是 native 呢,多谢指正 “列表渲染 1234” —— 这个例子其实虚拟 dom 不管是哪种实现,如果是通用的功能肯定做不到最佳,当然我也不是追求完全的性能最佳,通常不影响性能体验的小消耗还是便利性优先就行了,至于复杂 UI 之类的,还是交给 UI 框架自己处理吧,否则搞一整套也是个大工程 “这里再次建议尝试一下完整版的 vue” —— 我原计划也是,原生然后 react 和 vue 看看,react 看着有点复杂,暂时也打算 vue 一波,另外就是,前端这几年变化太快了,之前也偶尔看过一波,结果 vue 又说 3.0 了,还不知道 node 爹的 deno 未来会不会带起来节奏、但是目测有点难了,node 已经形成的庞大社区有点船大难调头了 |
17 lesismal 17 天前@otato 搜了下 native 相关的,似乎前端社区原生 js 可以叫 native,比如:而 react native 只是 react 移动端的、这个只是 react 内部的区分 |
21 lesismal 7 天前@shunia 感谢之前指出的相关知识点,最近研究了下 history 和 hash 路由,选择了对 hash 路由做点支持、根据路由切换内容,hash 路由确实不算复杂,但是内容管理本身还是需要原来的部分 随便找了个 admin 的模板项目,用 pm.js 、hash 路由切换内容的方式改造了下,去掉了多个页面大量的重复内容、去掉不必要的重复加载、重复下载之类的,切换内容更加顺滑、性能要好太多。我对前端不熟悉,各位交流中指出的问题能方便我更快去找到相关知识点、改进计划。 如有兴趣欢迎多来指点、给些批评建议: https://github.com/3rdrepo/adminkit :smile::smile: |