随着云计算的发展,越来越多的应用都已经迁移到云上,那么一款好用的浏览器就显得格外重要。Chrome浏览器从发布以来一直在吞噬浏览器市场,直到今日一直稳坐浏览器榜首的位置,无人能撼动。的确,Chrome浏览器在速度、扩展等方面非常出色,但在国内真的适合使用Chrome浏览器吗?我又是为什么从Chrome迁移到Firefox?
老样子,本文思维导图如下:
Chrome浏览器曾是我最主要的浏览器,没有之一,但随着Google撤出中国,Chrome与我渐行渐远。众所周知的原因,Chrome在国内不能使用Google服务,这就导致出现了以下问题:
虽然还有很多别的办法可以间接的实现同步、安装扩展的功能,但对于小白用户和懒人(例如我)十分不友好,即使找到教程一步一步安装还是会出现新的问题,这样你又要搜索新出问题,一直反复,直到我开始思考是否需要换个新的浏览器!
在选择新的浏览器有两个原则必须满足:
能满足这两点的浏览器真的很多,最先使用的微软新推出的Edge浏览器。因为Edge现在也开始使用Chromium内核(和Chrome内核一致),这样能保证速度。Edge已经发布正式版,现在正在体验中,不过目前看来Edge的扩展商店应用有限,还待完善。
国内的猎豹、QQ等浏览器现在也都开始使用Chromium内核,但扩展性不强。再看看浏览器市场份额,Firefox映入眼帘。
2019年桌面端浏览器市场份额
相比于Chrome的限制,更加推荐小白用户使用Firefox,下面我们从移动端和桌面端分别谈谈Firefox的表现。先说移动端,把重点放在桌面端,最后推荐一下个人使用频率超高的插件,供值友参看。
因为苹果的限制,所有在App Store上架的浏览器必须采用和Safari相同的WebKit内核,火狐为了能加入移动市场大战妥协了。
所以在iPhone、iPad上的浏览器也就谈不上性能的区分了,主要还是看浏览体验上是否能和桌面端保持一致,这点火狐做的还不错。Firefox iOS端加入了本地门户网站,支持书签、历史记录、登录信息的同步。
界面设计和桌面端保持一致,通过账号能多设备联动。
支持发送到设备,支持桌面版网站
手机端支持书签、历史记录以及登录信息同步。
Firefox设置界面
支持Siri快捷操作。
总之,一款手机端该有的功能它都有,而且能实现多设备之间的互动,这点体验很好!
Firefox和Chrome浏览器在内核上有本质的不同,随着Chrome一直在抢占桌面端浏览器的市场,Firefox背水一战,推出Firefox Quantum(全新渲染)。至于火狐是如何革自己的命感兴趣的可以搜索一下。
Firefox Quantum:
设计上:向扁平化设计靠拢,界面更加简洁。现在默认的界面就已经非常漂亮,甚至不需要安装主题扩展。如果你想让浏览器更加个性化可以通过扩展实现。
性能上:速度提升,效率提升。采用全新编写的渲染方式,让网站的加载、打开速度都较过去有很大的提升。下图是Firefox和Chrome对比。
Firefox和Chrome在常用网站打开速度对比(图片来自网络)
扩展上:经过这两年的发展,扩展数量上已经很多,最重要的是你常用的扩展它都有。
安装扩展不费劲
最后再说两点需要注意的地方:
为什么有国际版和中国版,火狐官方给出的答复:
Because the great wall in China, we need to provide local service as default sync service in China. And users can switch between local service and global service by enable/disable a preference.
国际版与国内版浏览器本身没有太大的区别,只是在功能和扩展上更加符合中国上网习惯。但是国际版国内版的账号是不通用的,如果想多设备联动你需要登录同一版本。我在初次安装时没有注意这一点还在纳闷为什么不能同步,提醒大家一下。
非常简单,如果你想切换,只需退出登录,在同步选项卡中选择“切换至全球服务”即为国际版,“切换至本地服务”即为中国版
切换全球服务
如果你想从Chrome迁移到Firefox非常方便,浏览器内置的数据迁移非常好用。选择Chrome中想要迁移的数据,不仅仅是书签、历史记录,还支持网站登录信息的迁移,一步到位,减少你在重新设置的烦恼。
从Chrome到Firefox迁移很简单
多设备同步这个功能真的很喜欢,可以实现类似于Apple生态圈中的同步功能。在Windows、Mac、iPhone、iPad上可以发送网页信息,方便在多设备上切换使用。
网页端发送
客户端接收
把书签、历史信息放在侧边栏,方便管理,非常喜欢这个功能。
书签侧边栏
外观类插件
重新设计的界面已经非常简单,但如果你还想根据自己的喜好更换,可以试一试Firefox官方插件Color,设置非常简单,所见即所得,几部就能完成浏览器的个性化。
Firefox Color
想浏览器变得更加生动,试试这款插件,Tab颜色随着网页主题颜色变换,非常炫酷。
标签变色
如果上述还是不能满足你,还想要更加专业的修改,可以试一试Stylus,这款插件的专业性就要强很多。
Stylus
黑暗模式,虽然现在部分网站已经支持黑暗模式,但是大部分还是不支持。通过Dark Reader插件能将网页转换为黑暗模式,更加适合在晚上观看。
可以自己设定
实用工具类插件
简阅这款有名的阅读类插件已经登录Firefox了,点击一下,让你更加专注的内容本身上,提供更好的沉浸式阅读体验。
提供更好的阅读体验
定义自己的阅读模式
大名鼎鼎的屏蔽广告类插件,不解释了。
喜欢Markdown的值友可以试试这款插件,通过自定义CSS,可以让你的内容在不同平台都有统一的样式,非常方便。
Markdown Here
电脑看时间长了,眼睛酸了,可以试试这款文字转音频插件,听听也不错。
将网页文字内容转换为音频
我是OneNote的重度用户,一键将网页内容粘贴到OneNote。
截图软件,提供多种选择,截图完成后保存可以选择为图片或者PDF文件。
提供多种截图模式,保存可以是图片或PDF文件。
鼠标的手势操作,通过自定义可以快速实现功能。
官方提供的“小号“神器,可以在一个浏览器中通过不同的Containers实现登录不同的账号,通过颜色区分,是真正的小号神器。非常推荐!
脚本管理插件,各种小功能走起来,用脚本行天下,哈哈!
主要是针对百度云盘,自动复制云盘分享的链接和密码,自动填充,直接打开分享内容,特别是一些没有密码的也可使用。
自动提取秘钥
边刷微博,边学习(上网)。
这个不是插件,而是一个网站,Firefox Send,文件最大上传支持1G,上传后下载一次或者24小时无下载即删除,临时大文件可以试一试,速度还可以。
前面便是我从Chrome迁移到Firefox的新路历程,如果你和我一样,想实现多设备同步,插件安装方便,可以给Firefox一个机会。
随着微软的Edge正式发布,相信浏览器市场还会有变动。目前Edge使用起来还是比较方便的,但是能不能撼动Chrome浏览器大哥的位置,还需要时间和深度体验,关于Edge我会在以后的文章中详细介绍。
以上!我是麦豆爸爸!
#头条数码潜力作者#
实很复杂,因为浏览器的主要功能是通过向服务器请求并在浏览器窗口中显示它来显示您选择的Web资源。但浏览器从“界面”到“渲染”,已经做了非常多的步骤,最终呈现在我们面前就是很简单的网页内容,下面我会详细叙述下浏览器内核的功能。
浏览器的核心部分应该是浏览器核心的“渲染引擎”,其主要作用是解释页面语法并渲染页面。因此,“渲染引擎”确定浏览器如何显示网页的内容和格式信息。不同的浏览器内核对网页编写的语法的解释不同,从而导致呈现效果不同,从而导致兼容性问题。
1.Trident
Trident(IE内核):该内核程序于1997年在IE4中首次采用。它是由Microsoft在Mosaic代码的基础上进行修改的,并在IE11中使用。也通常称为“ IE内核”。由于IE本身的“垄断”,Trident内核很长时间没有更新,这导致与W3C标准的脱节并暴露了安全性问题。
在2011年,Trident开始从IE 9支持HTML5和CSS3。自版本11起,IE最初已支持WebGL技术。IE8的JavaScript引擎是Jscript,IE9开始使用Chakra。Trident内核的常见浏览器是:
2. Webkit
Webkit(Safari内核,Chrome内核原型,开放源代码):它是Apple自己的内核,也是Apple Safari浏览器使用的内核。Webkit引擎包括WebCode排版引擎和JavaScript代码解析引擎。
它们分别来自KDE的KHTML和KJS。它们是GPL条约授权的免费软件,并支持BSD系统开发。Chrome,360 Extreme Speed Browser和Sogou High Speed Browser也使用Webkit作为内核(Chorome使用其自己的V8引擎来理解脚本)。
3. Blink
这是由Google和Opera Software开发的浏览器排版引擎,谷歌将其作为Chromium计划的一部分进行计算,并于2013年4月发布。
此渲染引擎是开源引擎Webkit中WebCore组件的一个分支,用于Chrome(28和更高版本),Opera(15和更高版本)和Yandex浏览器。
浏览器的主要组件是:
呈现引擎将开始从网络层获取请求的文档的内容。通常以8kB的块完成。
之后,这是渲染引擎的基本流程:
渲染引擎将开始解析HTML文档,并将元素转换为称为“内容树”的树中的DOM节点。引擎将解析外部CSS文件和样式元素中的样式数据。样式信息以及HTML中的视觉指令将用于创建另一棵树:渲染树。
渲染树包含具有视觉属性(如颜色和尺寸)的矩形。矩形按正确的顺序显示在屏幕上。
构建渲染树后,它将经历“ 布局 ”过程。这意味着为每个节点提供应在屏幕上显示的确切坐标。下一阶段是绘画,将遍历渲染树,并使用UI后端层绘画每个节点。
重要的是要了解这是一个循序渐进的过程。为了获得更好的用户体验,渲染引擎将尝试尽快在屏幕上显示内容。它不会等到所有HTML解析完毕后才开始构建和布局渲染树。部分内容将被解析并显示,而该过程将继续处理其余部分内容,这些其余内容始终来自网络。
简单来说,目前浏览器大致已经趋向于Webkit系,Webkit系的代码量还是很大的。加上Chrome的使用频率在PC市场中有着绝对市场,而且现在Win10的Edge也加入了Webkit体系,速度加快了不少。所以在不久的将来我们可以预见的是浏览器会以Webkit系为主,然后百花齐放。
、定义
<meta> 标签提供关于 HTML 文档的元数据。它不会显示在页面上,但是对于机器是可读的。可用于浏览器(如何显示内容或重新加载页面),搜索引擎(关键词),或其他 web 服务。
2、作用
meta里的数据是供机器解读的,告诉机器该如何解析这个页面,还有一个用途是可以添加服务器发送到浏览器的http头部内容,例如我们为页面中添加如下meta标签:
浏览器的头部就会包括这些:
只有浏览器可以接受这些附加的头部字段,并能以适当的方式使用它们时,这些字段才有意义。
3、meta的必需属性和可选属性
meta的必需属性是content,当然并不是说meta标签里一定要有content,而是当有http-equiv或name属性的时候,一定要有content属性对其进行说明。例如:
必需属性
<meta name="keywords" content="HTML,ASP,PHP,SQL">
这里面content里的属性就是对keywords进行的说明,所以呢也可以理解成一个键值对吧,就是{keywords:"HTML,ASP,PHP,SQL"}。
可选属性
在W3school中,对于meta的可选属性说到了三个,分别是http-equiv、name和scheme。考虑到scheme不是很常用,所以就只说下前两个属性吧。
http-equiv
http-equiv属性是添加http头部内容,对一些自定义的,或者需要额外添加的http头部内容,需要发送到浏览器中,我们就可以是使用这个属性。在上面的meta作用中也有简单的说明,那么现在再举个例子。例如我们不想使用js来重定向,用http头部内容控制,那么就可以这样控制:
<meta http-equiv="Refresh" content="5;url=http://blog.yangchen123h.cn" />
在页面中加入这个后,5秒钟后就会跳转到指定页面啦,效果可看W3school的例子
name
第二个可选属性是name,这个属性是供浏览器进行解析,对于一些浏览器兼容性问题,name属性是最常用的,当然有个前提就是浏览器能够解析你写进去的name属性才可以,不然就是没有意义的。还是举个例子吧:
<meta name="renderer" content="webkit">
这个meta标签的意思就是告诉浏览器,用webkit内核进行解析,当然前提是浏览器有webkit内核才可以,不然就是没有意义的啦。当然看到这个你可能会有疑问,这个renderer是从哪里冒出来的,我要怎么知道呢?这个就是在对应的浏览器的开发文档里就会有表明的,例如这个renderer是在360浏览器里说明的。360浏览器内核控制Meta标签说明文档
常用meta标签大总结
接下来就是常用的meta标签大总结啦,我会尽可能的做到全
charset
charset是声明文档使用的字符编码,解决乱码问题主要用的就是它,值得一提的是,这个charset一定要写第一行,不然就可能会产生乱码了。
charset有两种写法
两个都是等效的。
百度禁止转码
百度会自动对网页进行转码,这个标签是禁止百度的自动转码
<meta http-equiv="Cache-Control" content="no-siteapp" />
SEO 优化部分
viewport
viewport主要是影响移动端页面布局的,例如:
content 参数:
各浏览器平台
Microsoft Internet Explorer
Google Chrome
360浏览器
UC手机浏览器
UCBrowser_U3_API
QQ手机浏览器
Apple iOS
Google Android
App Links
最后——移动端常用的meta
*请认真填写需求信息,我们会在24小时内与您取得联系。