[工具探索]Safari 和 Google Chrome 浏览器内核差异

在这里插入图片描述

最近有些Vue3的项目,使用了safari进行测试环境搞开发,发现页面存在不同程序的页面乱码情况,反而google浏览器没问题,下面我们就对比下他们之间的差异点:

日常开发google chrome占多数;现在主流浏览器 Google Chrom、Safari、Microsoft Edge、Mozilla Firefox、Opera;以下简单介绍下:

  1. Google Chrome: Google Chrome 是当前最受欢迎的浏览器之一,由 Google 开发和维护。它以快速的性能、稳定性和丰富的扩展生态系统而闻名。
  2. Mozilla Firefox: Firefox 是由 Mozilla 基金会开发的开源浏览器。它注重隐私保护、自定义性和开放标准的支持。
  3. Microsoft Edge: Microsoft Edge 是由 Microsoft 开发的浏览器,其采用了Chromium引擎,这是Google Chrome使用的同一渲染引擎。Edge的新版取代了以前的EdgeHTML引擎。
  4. Apple Safari: Safari 是苹果公司为 macOS 和 iOS 设备开发的浏览器,使用WebKit渲染引擎。
  5. Opera: Opera 是一款具有一系列内置功能的浏览器,例如广告拦截、VPN、快速导航等。它也使用Chromium引擎。

常用浏览器对比

日常macbook使用场景,Safari和Google Chrome使用多些,就展开说说:

Safari 和 Google Chrome 使用不同的浏览器内核,这导致它们在渲染网页和执行一些网页技术时存在一些差异。以下是它们的主要内核及一些差异:

Safari:
  1. 内核: Safari 使用WebKit 内核。WebKit 是一个开源的渲染引擎,最初由苹果开发。它也是其他浏览器,如苹果的移动设备上的 Safari、iOS 浏览器等所使用的内核。
  2. JavaScript 引擎: Safari 使用 Nitro 引擎,这是 WebKit 内核中的 JavaScript 引擎。Nitro 引擎旨在提供快速的 JavaScript 执行性能。
  3. 渲染技术: Safari 支持一些苹果的独有渲染技术,如Core Animation、Core Graphics等,以提供更加平滑的用户体验。
Google Chrome:
  1. 内核: Google Chrome 使用 Blink 内核,这是一个由Google开发的开源渲染引擎。Blink 最初是从WebKit 分支出来的,因此它与WebKit 有一些相似之处。
  2. JavaScript 引擎: Chrome 使用 V8 引擎,这是一个由 Google 开发的高性能 JavaScript 引擎。V8 引擎被广泛用于其他 Google 产品和项目。
  3. 特有功能: Chrome 通常率先支持一些新的 Web 标准和技术,并且有一些特有的功能和工具,例如 Chrome 开发者工具。
差异和注意事项:
  • CSS 渲染差异: 由于不同的渲染引擎,有些 CSS 属性在 Safari 和 Chrome 中的解释和渲染可能有细微差异。
  • JavaScript 执行性能: 尽管两者都致力于提供高性能的 JavaScript 执行引擎,但它们的具体实现可能略有不同,可能导致在某些 JavaScript 代码方面的性能差异。
  • Web 标准支持: 虽然 Safari 和 Chrome 都遵循主流的 Web 标准,但可能在某些标准的支持上存在一些差异。

内存占用差异

Chrome:
  1. 多进程架构: Chrome 采用多进程架构,每个标签页、插件和扩展都在独立的进程中运行。这使得每个标签页的内存占用相对独立,可以提高稳定性和安全性。
  2. 任务管理器: Chrome 提供了任务管理器,您可以通过它查看每个标签页和插件的详细内存占用情况。在 Chrome 的地址栏中输入 chrome://system 可以找到任务管理器的入口。
  3. 开发者工具: Chrome 内置了强大的开发者工具,可用于分析和优化网页性能,包括内存占用。
Safari:
  1. 优化为 Apple 硬件: Safari 在 macOS 和 iOS 设备上表现良好,因为它是针对苹果硬件和操作系统进行优化的。

  2. Webkit 渲染引擎: Safari 使用 WebKit 渲染引擎,这是苹果自家的渲染引擎。WebKit 在性能和资源利用方面进行了优化。

  3. 活动监视器: 在 macOS 中,您可以使用 “活动监视器” 应用程序查看 Safari 的内存占用情况。

根据自身使用情况对比发现safari和google两者的内核基础版本都是基于WebKit,但是为啥safari慢慢就不大行(页面错乱,单方面测试存在误差),但safari也有优势:内存占用小;google Chrome就不同了,内存超高占用率;页面打开多,还存在闪退的情况;

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/442829.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【零基础学习CAPL】——CAN报文的发送(配合Panel面板单次发送)

🙋‍♂️【零基础学习CAPL】系列💁‍♂️点击跳转 文章目录 1.概述2.面板创建2.1.新建一个Panel2.2. 在Panel中调出控件窗口2.3.控件添加与配置 3.系统变量创建4.系统变量与Panel绑定5.CAPL脚本实现6.效果 1.概述 使用场景,按下面板按钮同时…

存内计算——助力实现28nm等效7nm功效

算力是数字经济时代的核心生产力,并且近年来需求剧增。而我国当前的算力供给上仍面临巨大的挑战,一方面,国外的高端算力芯片被美国禁售,另一方面,国内的芯片产业仍处于发展阶段[1]。如何获取算力提升,成为当…

力扣hot100 买卖股票的最佳时机 贪心 经典题

Problem: 121. 买卖股票的最佳时机 文章目录 思路复杂度Code 思路 假设今天卖出,那怎么样收益最大呢?之前买入价是最低的 复杂度 ⏰ 时间复杂度: : O ( n ) O(n) O(n) 🌎 空间复杂度: O ( 1 ) O(1) O(1) Code class Solut…

跟着pink老师前端入门教程-day14+15

2.6 main 主体模块制作 HTML&#xff1a; <div class"w"><div class"main"><!-- 焦点图模块 --><div class"focus"><ul><li><img src"./images/banner_bg.png" alt""></li>…

springboot中获取配置文件中属性值的几种方式

目录 第一章、使用Value注解第二章、使用PropertySource注解第三章、使用Configurationproperties注解第四章、使用Java Properties类第五章、使用Environment接口 友情提醒: 先看文章目录&#xff0c;大致了解文章知识点结构&#xff0c;点击文章目录可直接跳转到文章指定位置…

SpringBoot+Vue的商城系统

技术选型 开发工具&#xff1a;IntelliJ IDEA2020.3 运行环境&#xff1a;jdk8mysqlmavennodejs 服务端&#xff1a;SpringBootmybatis-plus 前端&#xff1a;VueaxiosElement-UIvuex 成果展示

Node.js Express 框架 2024版 笔记

1.0 操作命令 Node.js express 框架 https://www.expressjs.com.cn/ npm install -g express-generator expressexpress --pug --git // --pug 添加对 pug 模板引擎的支持 // --git 添加 .gitignore 代码仓库排除 //无法直接安装新版pug模板 npm i npm …

【Nuxt3】layouts的使用

简言 Nuxt 提供了一个布局框架&#xff0c;用于将常见的 UI 模式提取为可重用的布局。 为了获得最佳性能&#xff0c;在使用时&#xff0c;放置在此目录中的组件将通过异步导入自动加载。 layouts layouts文件夹存放的是ui布局文件&#xff0c;就是实现一个页面整体架构规则的…

云原生之steam游戏幻兽帕鲁私服部署

文章目录 服务端部署docker部署docker-compose部署 客户端安装及破解开始游戏 最近幻兽帕鲁这款游戏比较火&#xff0c;小编专门学习了下私服部署方法。由于这款游戏存在内存泄漏问题&#xff0c;运行一段时间就需重启&#xff0c;小编考虑将游戏部署到云原生中&#xff0c;通过…

qemu 抓取linux kernel vmcore

一、背景 在qemu调试linux kernel时 有时我们会遇到dump 情况&#xff0c;这时可以通过gdb 方式连接分析dump&#xff0c; 但实际中我们用得更多的是离线dump 分析&#xff0c;分析的文件通常是vmcore&#xff08;linux kernel panic 生成的coredump文件&#xff09;或者ramdu…

记录 arm 开发板上 nginx 配置 http 服务注意事项

1. 自定义项目&#xff0c;需要在 conf.d 目录中增加一个 .conf 配置文件&#xff1a; server {listen 9200; # 端口号server_name localhost; # 服务名称location / {root /home/imx6q/media; # 项目根目录&#xff08;需要修改 n…

JavaScript高级:js中面向对象编程

目录 1 引言 1.1 两者的区别 1.2 优缺点 2 封装性 3 原型 3.1 原型对象 3.2 构造函数和原型中的this如何指向 3.2.1 构造函数 3.2.2 原型对象 4 数组扩展案例--> 求和 和 最大值 5 原型对象中的constructor属性 6 对象原型 7 对象原型中的constructor属性 8 上…