聊聊Chromium
本文最后更新于37 天前,其中的信息可能已经过时,如有错误请发送邮件到big_fw@foxmail.com

最近在折腾一个 wails 项目 用 Go 做桌面应用的框架,过程中被迫搞懂了一件一直没细想过的事:为什么把网页打包一下,就能变成能读写文件、调系统权限的桌面软件?

答案绕不开一个词:Chromium。今天就顺手水一篇,把这事捋清楚。

Chromium 是什么?

说实话,如果你打开电脑的任务管理器,搜一下”进程”里带 Chrome 字样的东西,大概率能翻出来一长串。

不只是浏览器,可能还有你的 Slack、VS Code、Discord、微信 PC 版的某些功能模块,甚至你公司内部用的某个奇怪管理系统。这些八竿子打不着的软件,底层却悄悄共用着同一套东西:Chromium。

这事儿说起来挺讽刺的。十年前,做一个跨平台的桌面软件是件挺费劲的事——Windows 用 C#,Mac 用 Objective-C,界面还得各写一套,兼容性问题能把人逼疯。结果 Google 开源了 Chromium 之后,一群人突然发现:既然浏览器内核已经能把网页渲染得又快又稳,那干嘛不直接拿它当”界面引擎”,软件逻辑照样用 JS 写,爱在哪个系统跑就在哪个系统跑?

于是 Electron 应运而生,后来又衍生出 wails 这种更轻量的分支。逻辑很简单:前端工程师本来就会写网页,现在不用改行学 C++,照样能出桌面软件;而且一套代码打三份包(Win/Mac/Linux),省了大把重复开发的功夫

代价也不是没有——每个软件都得自带一份 Chromium,体积膨胀、内存暴涨,这才有了”一个记事本软件吃掉 300MB 内存”这种玩笑话。但即便这样,厂商还是前赴后继地选它,说明这笔”省人力换性能”的账,大部分公司都算得过来。

这就是为什么你电脑里那么多”看起来毫不相关”的软件,扒开一看,都住着同一个房客。

Chromium 是 Google 开源出来的一套浏览器内核 / 底层框架,负责渲染网页、跑 JavaScript、处理网络请求这些浏览器该干的脏活累活。它是开源的,免费的,谁都能拿去用。

Chrome 是 Google 在 Chromium 基础上,加了一堆自己的东西(账号同步、插件商店、内置的一些 Google 服务、还有一些不开源的编解码器)包装出来的产品。

换句话说:Chromium 是毛坯房,Chrome 是精装修版。而且不只 Chrome,现在市面上一大票浏览器都是拿 Chromium 当地基盖起来的——Edge、Opera、Brave、国内一堆”双核浏览器”的极速模式,底子基本都是它。这也是为什么现在网页兼容性问题比早年 IE 时代好太多了:大家用的是同一套内核。

那 Chromium 跟”打包成桌面软件”有什么关系

正常情况下,网页是”关”在浏览器沙盒里的——出于安全考虑,网页 JS 不能随便读你电脑的文件、不能随便调系统功能,不然任何一个恶意网站都能把你电脑搞崩。这套限制是浏览器厂商刻意加上去的安全策略。

但 Chromium 内核本身其实是有能力做这些事的,只是被”锁”住了。

于是像 Electron(Node.js 生态)、wails(Go 生态)这类框架,干的事情就是:

  1. 自己内嵌一份 Chromium,不受浏览器厂商那套安全策略管
  2. 额外搭一条通道,让前端页面能直接跟后端程序(Node.js 或 Go)通信
  3. 后端程序有完整的系统权限,前端调用后端,间接就能读文件、调系统 API

打个比方:普通网页的 JS 相当于关在一个隔离房间里,浏览器只给开了几扇”安全小窗”。而 Electron/wails 相当于给这个房间多装了一扇门,通向后台那个真正有钥匙的人。

这也是为什么你现在用的很多”桌面软件”其实是套壳网页——比如 VS Code、Slack、Discord 桌面版,本质都是 Electron 打包出来的,里面跑的是 HTML/CSS/JS,只是套了层能访问系统的壳。

为什么这套模式这么流行

说白了就是省事。以前想做一个跨平台的桌面软件(Windows/Mac/Linux 都能跑),得用 C++/C# 之类的语言分别适配,成本很高。

而现在:前端工程师会的 HTML/CSS/JS,直接就能用来写桌面应用界面,不用重新学一门语言。后端根据需要接 Node.js(Electron)或者 Go(wails),打包完就是一个独立的 exe,用户不需要单独装浏览器或者运行环境。

代价也很直接:每个 Electron 应用都得自带一份完整的 Chromium,所以体积普遍偏大,内存占用也比原生程序高不少——这也是为什么很多人吐槽”一个聊天软件怎么吃 500MB 内存”,锅很大程度在这。

严格说,chromium本身就是一个可以独立运行的浏览器(去 Chromium 官网能直接下载装上用,界面长得跟 Chrome 有点像,但没有 Google 账号同步、没有内置的某些编解码器)。

那 Electron/wails 打包的 App,是不是”内置了一份 Chrome”?

准确说法是:内置了一份 Chromium 引擎的代码(不是 Chrome 这个产品,是 Chromium 这个开源项目),拿来当渲染器用,但不是把整个”Chromium 浏览器”这个软件塞进去。

具体说,一个 Electron/wails 应用打包的时候,拿走的是 Chromium 项目里负责这几件事的那部分代码:

  • 解析 HTML/CSS,把网页排版画出来
  • 跑 JavaScript 引擎(V8)
  • 处理网络请求

不会带上浏览器该有的那些”浏览器功能”——没有地址栏、没有标签页、没有书签、没有前进后退按钮、没有下载管理器。这些东西 Electron/wails 压根没打包进去,因为用户根本不需要

写在最后

折腾这些底层原理的过程挺有意思的,平时天天用的东西,扒开一层壳发现逻辑其实没那么玄乎。下次再遇到”这软件为啥这么占内存”这种疑问,大概率答案就是:又是一个 Chromium 套壳的。

文末附加内容
暂无评论

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇