这问题其实很多刚入行的同学经常搞混，所以今天我来一次性讲明白——浏览器内核到底有哪些？它们各自又有什么区别？
说白了，浏览器内核就是浏览器的大脑，分两部分：
-
渲染引擎（Rendering Engine）：负责网页的排版渲染，HTML、CSS统统交给它。
-
JS引擎（JavaScript Engine）：处理JavaScript脚本逻辑，比如你点按钮后弹出对话框这种行为。
1）常见浏览器内核盘点
下面我直接列几个主流的浏览器内核，顺便标注下代表浏览器：
- Blink（Chrome内核）
-
代表浏览器：Google Chrome、新版Microsoft Edge、Opera、Brave、Vivaldi等
-
前身：是WebKit的一个分支，由Google主导开发
-
特点：速度快、标准支持全面、生态最强！可以说大半个地球都在用这个内核。
这个真的牛啊，性能优化一波接一波，比如页面预加载、V8引擎配合使用，很多Web开发的“标准”，基本都先在Blink阵营里试验。
- WebKit（Safari内核）
-
代表浏览器：Apple Safari、早期的Chrome（没错Chrome刚出时是WebKit）
-
特点：苹果亲儿子，对macOS和iOS系统适配最好，资源占用少，但对一些新标准支持慢半拍。
我试过在Mac下用Safari调试网页，体验其实还行，但一到复杂页面，调试工具跟不上Chrome，略显捉急……
- Gecko（Firefox内核）
-
代表浏览器：Mozilla Firefox
-
特点：开源，支持标准完整，有些API实现得比Chrome还早！
我之前做Web插件开发时，就被Gecko内核感动过：扩展性非常强，但就是用户群少了点，市占率被Chrome打爆了……
- Trident（IE内核）
-
代表浏览器：Internet Explorer（IE6～IE11）
-
特点：早期主流，后来成了前端开发者的噩梦！兼容性问题一大堆！！！
我之前做政府项目，还遇到要求必须支持IE9的，页面写一半感觉人生走到了尽头……啥都要特判一堆hack……
- EdgeHTML（旧版Edge内核）
-
代表浏览器：Windows 10 早期自带的Edge
-
特点：微软想自己搞一套新内核，最后折腾不过Chrome，宣布投降，切换到Blink。
EdgeHTML我没怎么认真用过，公司内测了一次，结果前端同事一脸绝望：页面不炸就不错了……
有小伙伴私信我想要RPA编程教程，我最近找到了一个免费学习RPA网站，提供给大家免费学习
完全免费：songshuhezi.com/rpa.html
2）还有一些冷门/实验内核（了解下）
虽然主流就那几个，但其实还有一些其他的内核，你可能听过：
-
Presto：Opera老版本的内核，现在基本淘汰了。
-
Servo：Mozilla搞的Rust写的实验性引擎，后来停摆了，不过理念先进。
-
KHTML：WebKit的爹，最初由KDE团队开发，现在也没人维护了。
3）总结一张图，核心全在这
4）开发时需要注意的事
开发Web应用时，兼容性是永恒话题，这里分享几个我踩过的坑：
-
flex布局早期在IE根本不支持，写了一堆-ms-前缀。 -
position: sticky在老版本Safari完全无效。 -
WebRTC在Safari下坑超级多，iOS端问题尤其多。 -
用Vue做H5页面时，iPhone 12 Safari突然渲染不出圆角按钮，排查半天原来是WebKit的一个旧Bug……
最后总结一下
1）浏览器内核主要就三大派：Blink、WebKit、Gecko，其他基本淘汰或边缘化。
2）Blink现在是霸主，Chrome系一家独大，但也带来“内核垄断”问题。
3）Web开发还是要注意不同内核的兼容性差异，尤其是老版本IE或者Safari。
4）我建议调试时用Chrome为主，Safari和Firefox为辅，IE能不碰尽量别碰。