要达到最接近原生体验的前端体验,无疑是直接和 GPU 交互构建 UI 的 webgl
比之 flutter 这种再造一门语言和生态,webgl/gpu 现在市面上就有一定的人才和生态储备了,大量游戏程序员和本身原来写 webgl 的都可以无缝转过去
一旦有个大公司或民间项目牵头,出个"精简版"的"游戏引擎",专门用于网页 /app 的构建,那现在的各种高级 jQuery ( React 、Vue 之流)是不是就该时代的眼泪了
以后写网站都没什么 virtual dom ,css ,html 布局了,开局一个 canvas ,UI 全靠拖
1
googlefans 2023-01-07 16:49:40 +08:00
弄网站的话 如果只是纯内容类的产品,都不需要后台数据库 直接静态都搞定 https://getpublii.com 省心省事 只需要专心做好内容就可以了
|
2
angrylid 2023-01-07 16:54:05 +08:00 via Android
呃呃,你这一切猜想的前提是原生是更好的,浏览器要朝原生发展。
但是实际情况是原生软件纷纷往里面塞个浏览器开网页。 |
3
MMMMMMMMMMMMMMMM OP @googlefans 现在这么艰难的么,连普通交流都要带上推广
|
4
MMMMMMMMMMMMMMMM OP |
5
secondwtq 2023-01-07 17:04:53 +08:00 1
Canvas 和 WebGL 是两个东西啊 ... 而且很多事情 SVG 也能做
然后就是上面这些都是实现细节,你这个想法关键是在你的那个“游戏引擎”上 这就要说到 Web 这个东西的特殊性了,就是现在这个局面本质上是 GUI 框架之外的层级对 GUI 框架这一层级长期巴尔干化的现状不满意后果,Web 是个通用的东西。 那你这个“游戏引擎”要怎么做成另一个通用的东西?就算真做成了,历史是一个圈,最多不过是做成另一个 Web 而已。 |
6
PTLin 2023-01-07 17:21:49 +08:00
说到底我认为 canvas 和 webgl 只是对 web 功能的一种补充,webgl 也不等于在浏览器使用 opengl ,实际上不少人吐槽过 webgl 的 bug 多,底层像一个黑盒一样,而 canvas 的速度也不如原生的 web 元素一样。并且从调试,开发套件等等各种方面来看都不足以替代现有的成熟的 web 开发技术。
我认为未来的”前端“一定是一种新的东西,而不是在现有浏览器的 Html+CSS+JS DOM canvas gl 各种各样的浏览器接口之上构建起来的东西。 |
7
agagega 2023-01-07 17:27:11 +08:00 1
wasm 都不能用来写界面,还早着呢。楼主说的用 canvas 取代 DOM ,Flipboard 很久以前就干过了: https://www.infoq.cn/article/2015/04/flipboard-web-version
|
8
wlsnx 2023-01-07 17:43:14 +08:00 3
一个 canvas https://www.egui.rs/#demo
|
9
MMMMMMMMMMMMMMMM OP |
10
okakuyang 2023-01-07 17:51:45 +08:00
错之又错
|
11
antonius 2023-01-07 18:02:22 +08:00
大量游戏程序员写 webgl ? webgl 用在普通 app 上还行,比如 mapbox 的[mapbox-gl-js]( https://github.com/mapbox/mapbox-gl-js)。在游戏上还是差了不少。不清楚 unity3d ,unreal 研发的产品,但自研引擎的开发团队没有理由抛弃 native ,转而拥抱 web 。
|
12
MMMMMMMMMMMMMMMM OP @antonius 直接写 webgl 肯定硬核啊,也没多少人能写,需要一个两方都懂的人桥接一下,出一套"引擎"
|
13
dw2693734d 2023-01-07 18:08:29 +08:00
未来是 web3
|
14
PTLin 2023-01-07 18:09:16 +08:00 1
@MMMMMMMMMMMMMMMM react ,vue 说到底只是引入了 ui=f(state)的思想,实际上还是 html 和 css ,虚拟 dom 在怎么 virtual 说到底还是落实到 dom 上还是 web api 那一套。使用原有的技术,解决了明显的痛点,加快了开发的速度,所以这两个才能短时间流行起来。
你说的压根就和这种不沾边,在现有的 web 基础上构建起来你说的那种就是纯纯的大坑,flutter web 不就是例子。 |
15
secondwtq 2023-01-07 18:20:09 +08:00 1
@MMMMMMMMMMMMMMMM 其实有现成的,Qt 就能: https://www.qt.io/qt-examples-for-webassembly
问题是人家 Qt 没能做到你要的那个程度啊 我的意思是,specific 的技术和微小的细节被看得太重了。你所担心的,卷来卷去的事情,历史上已经多次发生,以后很可能继续发生。Mac 有 Cocoa 踢掉 Pascal ,现在又要 SwiftUI 和 Cocoa 共存,Gamedev 有 shader 踢掉 fixed pipeline ,然后是底层 API 和高层 API 共存,就连 Qt 也一点点 QtWidgets 换 QML 了,至于微软和 Web 的破事就不用我说了。我不会有“以后不会再发生类似的事情”的想法。 作为一个开发者,什么适合当前的问题就用什么。在这个上下文里,Web 并不特殊,特殊的是它的*生态位*。你所述的使用场景(跨平台)之所以常用 Web 是因为它占据了这个生态位。如果这个位置换人了就再用新的就是。更应该关心的,不仅是作为开发者,更是作为用户,是新的和旧的哪个更屎,屎多少,你的系统里会最后会有多少 XX 引擎。 |
16
antonius 2023-01-07 18:31:16 +08:00
web 行业不清楚,游戏业内有基于 OpenGL 的 HTML/CSS GUI 实现。确实方便,比如这个:
[RmlUi]( https://github.com/mikke89/RmlUi) . Valve 的 Panorama UI 也是游戏内的类似 HTML5 的实现。 https://moddota.com/panorama/introduction-to-panorama-ui-with-typescript |
17
rpman 2023-01-07 18:40:46 +08:00
现在 web 压倒原生是 cpu 性能随便造之后的产物。性能向开发量妥协。
等 gpu 性能随便造了,webGL 的基础就有了。 |
18
chiuan 2023-01-07 18:42:54 +08:00
webgl 已经好多年了 主要是体验没法有 app 流畅
|
19
secondwtq 2023-01-07 18:52:08 +08:00 3
... 噢对了,如果楼主说的"native"是指移动端的话,那么现有解决方案比 Qt Web 更成熟
楼主的 idea ,再一次地,是 Atwood's Law 的一个体现——类似的事情桌面 GUI 早就做完了,叫做 DirectUI 。 并且 DirectUI 一般并不会直接写 3D API 函数或 Shader ,一般的 DirectUI 的架构是,由一个 Window System Abstraction 提供窗口、事件处理和 3D API Context 等平台相关的,最基本的东西,然后由一个 Vector Graphics Library 提供高层绘图 API ,然后上层的组件调用 Vector Graphics Library 绘图,Vector Graphics Library (可能)会调用 3D API ,也可能直接 CPU 渲染了(我现在打字用的这个 Firefox 就是没法用 GPU 加速的 ... 而我打开上面那个 Qt Web 的 demo 页面会直接告诉我不资瓷,所以依赖于 3D API 是有问题的,而 Vector Graphics Library 可以帮你解决)。 而 Web 浏览器本身就可以看成 DirectUI 的一种实现。比如在 Chromium 系浏览器中,Window System Abstraction 的角色由 Aura 担任,Vector Graphics Library 由 Skia 担任。 要实现所谓的“跨平台 native 体验”,最简单的是干掉 Web ,而不是设法绕过 Web——绕过 Web 其实就相当于在 Web 这个 DirectUI 上再做一层 DirectUI ,让浏览器来当 Window System Abstraction ,这不是画 Python 舔 jio 么。而干掉 Web 的结果就是 Flutter ... 你要 JS 生态的话 React Native 也行,或者 Flutter Web ,Qt Web ... 但是大的 idea 是不变的 所以你看局早就设好了,只是鸡还在炖没开始吃而已 ... |
20
wanguorui123 2023-01-07 18:52:25 +08:00 7
webgl 做 App 好比脱裤子放屁,重新发明一套 HTML
|
21
mxT52CRuqR6o5 2023-01-07 18:58:40 +08:00
首先无障碍就很难做
|
22
loading 2023-01-07 19:01:13 +08:00 via Android
ui 全靠拖?
有没有可能以前 Dreamweaver 时代就是拖出来的。 |
23
crysislinux 2023-01-07 19:41:45 +08:00 via Android
直接画好做的话,桌面端就不会越来越多 Electron 了。
|
24
murmur 2023-01-07 20:35:07 +08:00
为啥要 webgl ,unity 不好么,专业开发游戏、3d
|
25
revalue 2023-01-07 21:27:44 +08:00
DOM canvas webgl ,玩法不一样,导致适用范围不一样。你说的就是 webgl 取代 DOM ,开发起来非常不适
|
26
youtubbbbb 2023-01-08 01:41:15 +08:00
我的评价是,南辕北辙。就像楼上说的,electron 这么多,说明靠自己画控件去做 ui 是费时费力的,除非一些特殊场景,比如 Google Docs 。
退一步讲,即使是有一套控件库了,你怎么去解决响应式的问题呢。组件一多肯定需要一套语言去描述,怎么去设计这套语言呢?是不是最后又很容易回到 html/css/javascript 的思路上来。 |
27
dcoder 2023-01-08 06:31:23 +08:00
未来是原生 3D app, 就像 3D game engine 做出来的效果.
现在这个过度复杂的 HTML/CSS/JS 2D layout 框架... 就是点错了科技树... |
28
yulon 2023-01-08 08:04:24 +08:00
WebXXX 不是用来替代谁的,是用来复用已有的东西的,不然要性能不如原生,要便利不如非原生
|
29
zeal7s 2023-01-08 10:08:25 +08:00
btw, 现在出了更新的技术,叫 webgpu ,性能比 webgl 更好
|
30
southsala 2023-01-08 10:54:37 +08:00
性能和功耗不是问题直接用游戏引擎做客户端不好吗?
|
31
zjsxwc 2023-01-08 11:19:03 +08:00 via Android
那为什么不直接用 gpu 渲染 dom 。
|
33
reiji 2023-01-08 14:34:40 +08:00
可以看看飞书文档,就是基于 canvas 的,这种主要还是适合有复杂界面交互 /排版的场景,性能反而不是主要考虑的方向
|
34
luoqeng 2023-01-08 22:02:51 +08:00
浏览器最重要的排版引起啊,要自己重写个?
|
35
yimity 2023-01-09 10:21:46 +08:00
嗯,用 webgl 再实现一套 HTML CSS 解释引擎?
|
36
birdinforest 2023-01-09 13:12:21 +08:00
我观察到的业界情况是
Web3D 框架在融入 HTML 标准: https://github.com/pmndrs/react-three-fiber 。 开源游戏引擎 Godot 和 Unity 都潜在支持桌面 APP 的开发。 |
37
wangtian2020 2023-01-09 15:07:04 +08:00
应用场景还不够大,需要 AI 来降低建模成本
|
38
fighte97 2023-01-10 16:16:11 +08:00 1
我只希望低代码 /无代码早点死
一张图要一个 panel 打开这个 panel 还要花两三秒 |