XPS15 9560 Clover 安装配置
1个月前

XPS15-9560-Mojave

xps15-9560 吃上黑果的 clover 配置,不方便下载的童鞋可以前往yeliujun/XPS15-9560-Mojave

English | 中文

更新日志

2019-05-07

  • 现在使用VirtualSMC(1.0.3)替代FakeSMC.
  • 默认使用防误触的触摸板驱动 VoodooPS2Controller(1.9.2) + VoodooI2C(2.1.5).
  • 更新Lilu系列驱动.
  • 添加了博通蓝牙参数bpr_probedelay=100 bpr_initialdelay=300 bpr_postresetdelay=300.

更多详见changelog.md

配置

  • CPU:Intel I7 7700HQ
  • 内存:16G(8G*2) 2400MHz DDR4
  • 硬盘:东芝 NVMe 512G
  • WIFI 网卡:已更换为博通 DW1830
  • 屏幕分辨率:4K 触控屏

特性

  • CPU: I7-7700HQ,已启用原生电源管理;多档变频正常,添加了CPUFriendDataProvider.kext,低频可到800MHZ,续航表现更好。
  • 声卡: ALC298, 注入 ID:72,声音正常。耳机切换采用 ALCPluginFix。(Combo jack 在 Mojave 下面似乎失效了)
  • 触摸板: 含触屏,使用VoodooI2C,支持 Mac 原生手势。缺点就是没有防误触
  • WIFI: 原配 Killer 1535 无法驱动,更换 DW1830, 实现免驱。(DW1560 应该也可以正常使用)
  • 蓝牙: 驱动正常,极少数情况下会设备丢失,handoff 也正常。(没测过 1535 的蓝牙)
  • ACPI: 使用 hotpatch 进行热修复,亮度快捷键映射正常。
  • USB: USB3 端口均正常使用; TYPE-C 可以热插拔使用;雷电 3 不支持热插拔
  • 显卡:集显 HD630 注入591B0000正常驱动;独显 GTX 1050 无解。
  • 读卡器:无法使用

升级教程

  1. 下载仓库配置文件。
  2. 将自己的三码替换到下 CLOVER 目录下的config.plist对应位置。
  3. 把下载的 CLOVER 替换自己本地的 CLOVER 文件夹。
  4. 升级完之后,可能会出现以下异常现象,如亮度不能调节等。打开终端运行sudo kextcache -i /命令,重建缓存,重启。

安装教程

实在不想写教程,可以参考小米笔记本 pro 的安装教程,详见bilibili 小米 pro 教程

提示

  1. 不开启FileValue加密,不开启FileValue加密,不开启FileValue加密!!!

小问题处理方式

1. 字体细、发虚

终端执行defaults write -g CGFontRenderingFontSmoothingDisabled -bool NO,注销再登录即可

2. 1080P 开启 HIDPI

使用xzhih/one-key-hidpi

3. 安卓 USB 网络共享

Post-install里面的HoRNDIS.kext放入CLOVER/kexts/Other

Wifi 蓝牙设置

  1. 关闭 wifi 唤醒和小憩,系统偏好设置 -> 节能 取消两个选项卡中的小憩唤醒以供Wi-Fi网络访问的勾选。
  2. 关闭蓝牙唤醒电脑, 系统偏好设置 -> 蓝牙 -> 高级 取消所有勾选。
  3. 非 DW1830 需要替换Post-install/非DW1830BT/USBPower.kextCLOVER/kexts/Other/
  4. DW1830 在 windows 下设置,设备管理器,右键 dw1830(即无线网卡)->属性->高级->Bluetooth Cooperation(前面 Bluetooth 一致,后边可能不同),设置为 disable

鸣谢

RehabManAcidantheraPMheartalexandredwmchrisdarkhandzgunslinger23goodwin

注:排名不分先后;如有遗漏,请勿见怪,感谢您的付出;

浏览器渲染过程及原理
9个月前

浏览器渲染过程及原理

五大主流浏览器和四大内核

  1. IE浏览器:Trident
  2. Chrome浏览器:以前是Webkit,现在是Blink;
  3. Firefox浏览器:Gecko
  4. Safari浏览器:Webkit;
  5. Opera浏览器:Presto(自己的),后来是Webkit,现在是Blink;

浏览器的主要构成

  1. 用户界面 - 包括地址栏、后退/前进按钮、书签目录等,UI界面。
  2. 浏览器引擎 - 用来查询及操作渲染引擎的接口。
  3. 渲染引擎 - 用来显示请求的内容,例如,如果请求内容为html,它负责解析html及css,并将解析后的结果显示出来。
  4. 网络 - 用来完成网络调用,例如http请求,它具有平台无关的接口,可以在不同平台上工作。
  5. UI后端 - 用来绘制类似组合选择框及对话框等基本组件,具有不特定于某个平台的通用接口,底层使用操作系统的用户接口。
  6. js解释器 - 用来解释执行JS代码。
  7. 数据存储 - 属于持久层,浏览器需要在硬盘中保存类似cookie的各种数据,Html5定义了web database技术,这是一种轻量级完整的客户端存储技术

浏览器构成

渲染

渲染引擎的职责就是渲染,即在浏览器窗口中显示所请求的内容。默认情况下,渲染引擎可以显示html、xml文档及图片,它也可以借助插件(一种浏览器扩展)显示其他类型数据,例如使用PDF阅读器插件,可以显示PDF格式

从简单的开始

简单的俩说,页面渲染就是浏览器将html代码根据CSS定义的规则显示在浏览器窗口中的这个过程。

  1. 浏览器从用户输入的地址开始,向服务器发出请求,服务器返回html文件。
  2. 浏览器开始载入html文件,发现<head>标签内有一个<link>标签引用外部CSS文件;
  3. 浏览器又发出CSS文件的请求,服务器返回CSS文件。(同步)
  4. 浏览器继续载入html中<body>部分的代码,并且CSS文件已经拿到手了,可以开始渲染页面
  5. 浏览器在代码中发现一个<img>标签引用了一张图片,向服务器发出请求(异步)。此时浏览器不会等到图片下载完,而是继续渲染后面的代码
  6. 服务器返回图片文件,由于图片占用了一定面积,影响了后面段落的排布,因此浏览器需要回过头来重新渲染这部分代码
  7. 浏览器发现了一个包含一行JavaScript代码的<script>标签,赶快运行它
  8. javascript脚本执行了这条语句,它命令浏览器隐藏掉代码中的某个<div> (style.display=”none”)。杯具啊,突然就少了这么一个元素,浏览器不得不重新渲染这部分代码。

HTML渲染主流程

基本流程: dom树 -> 构建render树 -> 布局render树 -> 绘制render树 渲染流程

渲染引擎开始解析html,并将标签转化为内容树中的dom节点。接着,它解析外部CSS文件及style标签中的样式信息。这些样式信息以及html中的可见性指令将被用来构建另一棵树——render树。

Render树由一些包含有颜色和大小等属性的矩形组成,它们将被按照正确的顺序显示到屏幕上。

Render树构建好了之后,将会执行布局过程,它将确定每个节点在屏幕上的确切坐标。再下一步就是绘制,即遍历render树,并使用UI后端层绘制每个节点。

  • webkit

渲染流程

  • Geoko

渲染流程

  • Geoko中的Frame树与webkit的Render树,Geoko的Reflow和Webkit的Layout,理念上来说是一样的。
  • Geoko在解析HTMl和构建DOM树之间有一层Content Sink(内容接收器),用于生成DOM元素,这是webkit所没有的

解析与DOM树构建

解析

解析的两个子过程——语法分析词法分析

  • 词法分析 :将输入分解为符号
    • 符号:是语言的词汇表——基本有效单元的集合。
    • 词法分析器 :将输入分解为合法的符号
  • 语法分析:指对语言应用语法规则。
    • 解析器:根据语言的语法规则分析文档结构,从而构建解析树

解析

  • 解析的过程进一步可视为四步:源文档 -> 词法分析 -> 语法分析 -> 解析树
  • 解析的更细致的迭代过程是:
    1. 词法分析器得到符号,传给解析器
    2. 解析器用符号匹配语法规则
      * 若匹配上规则,则符号对应的节点将被添加到解析树上
      * 若没有匹配上规则,解析器将在内部保存该符号,然后从词法分析器取下一个符号,再次匹配规则
      * 若在之后能使内部符号匹配上规则,则符号对应的节点将被添加到解析树上
      * 若到最后都没有匹配上规则,解析器将抛出一个异常,这意味着文档无效或是包含语法错误。
    3. 最终得到解析树或异常

转换

  • 解析一般在转换(将输入文档转换为另一种格式)中使用,因此,解析树可能不是最终结果,比如编译。其过程为:源码 -> 解析 -> 解析树 -> 转换 -> 机器码

解析器类型

  • 自顶向下解析,查看语法的最高层结构并试着匹配其中一个
  • 自底向上解析,从输入开始,逐步将其转换为语法规则,从底层规则开始直到匹配高层规则
  • HTML的格式定义--“DTD”不是上下文无关,所以传统解析方式(自顶向下或自底向上)都不适用于HTML

HTML解析

  • HTML解析 包括两个阶段——符号化(tokeniser)及构建树(tree construction)(和之前的具体算法不一样,但几个过程是类似的)
  • 符号化(可和传统的词法分析类比):是词法分析的过程,符号识别器将输入解析为符号(html的符号包括开始标签、结束标签、属性名及属性值)。将其传递给树构建器。
  • 构建树(可和传统的语法分析类比):树构造器处理传来的符号,根据规范每个符号会创建对应的Dom元素,这些元素除了会被添加到Dom树上,还将被添加到开放元素堆栈中。这个堆栈用来纠正嵌套的未匹配和未闭合标签(HTML“宽容”的原因)。 HTML解析流程

例:

<html>
<body>
<p>
Hello DOM
</p>
<div><img src=”example.png” /></div>
</body>
</html>

dom

CSS解析

  • css属于上下文无关文法,可以用前面所描述的解析器(自顶向下或自底向上)来解析
  • Webkit的CSS解析器将每个css文件解析为样式表对象,每个对象包含css规则,css规则对象包含选择器和声明对象,以及其他一些符合css语法的对象 处理脚本及样式表的顺序

例:

css

脚本

  • 解析到一个script标签时立即解析执行脚本,并阻塞文档的解析直到脚本执行完。
  • 如果脚本是外引的,则网络必须先请求到这个资源——这个过程也是同步的,会阻塞文档的解析直到资源被请求到。
  • 开发者可以将脚本标识为defer,以使其不阻塞文档解析,并在文档解析结束后执行(<script defer src="script.js"></script>)。Html5增加了标记脚本为异步的选项,以使脚本的解析执行使用另一个线程。(<script async src="script.js"></script>

预解析

  • 当执行脚本时,另一个线程解析剩下的文档,并加载后面需要通过网络加载的资源。这种方式可以使资源并行加载从而使整体速度更快
  • 需要注意的是,预解析并不改变Dom树,它将这个工作留给主解析过程,自己只解析外部资源的引用,比如外部脚本、样式表及图片 样式表
  • 因为执行脚本可能会请求样式信息,如果此时样式还没有被加载和解析完成,那么脚本可能出错。所以样式表会阻塞脚本执行(不会阻塞外部脚本的加载) Firefox在存在样式表还在加载和解析时阻塞所有的脚本
  • Chrome只在当脚本试图访问某些可能被未加载的样式表所影响的特定的样式属性时才阻塞这些脚本

渲染树的构建

  • DOM树构建完后,开始构建渲染树。Firefox将渲染树中的元素称为frames,WebKit则用renderer或渲染对象来描述这些元素。
  • 每个渲染对象用一个和该节点的css盒模型相对应的矩形区域来表示,包含诸如宽、高和位置之类的几何信息

渲染树和Dom树的关系

  • 不可见的Dom元素(比如<head>)不会被插入渲染树,display属性为none的元素也不会在渲染树中出现
  • 当文本因为宽度不够而折行时,新行将作为额外的渲染元素被添加
  • 一个行内元素只能仅包含行内元素或仅包含块状元素,在存在混合内容时,将会创建匿名的块状渲染对象包裹住行内元素。

创建树的流程

  • Firefox用一个监听器监听DOM,Frame Constructor计算样式并创建Frame
  • Webkit中每个Dom节点有一个attach方法,调用新节点的attach方法将节点插入到Dom树中

样式计算

  • 创建渲染树需要计算出每个渲染对象的可视属性,这可以通过计算每个元素的样式属性得到
  • 样式包括各种来源的样式表,行内样式元素及html中的可视化属性(例如bgcolor),可视化属性转化为css样式属性。

样式表的级联顺序

具有同等级别的声明将根据specifity以及它们被定义时的顺序进行排序。

  • 浏览器声明
  • 用户声明
  • 作者的一般声明
  • 作者的important声明
  • 用户important声明

specifity

如果声明来自style属性,而不是一个选择器的规则,则计1,否则计0(=a)

计算选择器中id属性的数量(=b)

计算选择器中class及伪类的数量(=c)

计算选择器中元素名及伪元素的数量(=d)

连接a-b-c-d四个数量将得到specifity。四级(a、b、c、d)之间并不是简单的相加关系。同一级(例如:a对a)的才具有可比关系

布局

  • 当渲染对象被创建并添加到树中,它们并没有位置和大小,计算这些值的过程称为layout或reflow。

绘制

  • 遍历渲染树并调用渲染对象的paint方法将它们的内容显示在屏幕上,绘制使用UI基础组件
  • 一个块渲染对象的堆栈顺序是:
  1. 背景色
  2. 背景图
  3. border
  4. children
  5. outline

渲染引擎的线程

  • 渲染引擎是单线程的,除了网络操作以外,几乎所有的事情都在单一的线程中处理,在Firefox和Safari中,这是浏览器的主线程,Chrome中这是tab的主线程。 网络操作由几个并行线程执行,并行连接的个数是受限的(通常是2-6个)。

    事件循环

  • 浏览器主线程是一个事件循环,它被设计为无限循环以保持执行过程的可用,等待事件(例如layout和paint事件)并执行它们

回流与重绘

  • reflow:当render树中的一部分或者全部因为大小边距等问题发生改变而需要重建的过程叫做回流
  • repaint:当元素的一部分属性发生变化,如外观背景色不会引起布局变化而需要重新渲染的过程叫做重绘

回流何时发生:

当页面布局和几何属性改变时就需要回流。下述情况会发生浏览器回流:

  1. 添加或者删除可见的DOM元素;
  2. 元素位置改变;
  3. 元素尺寸改变——边距、填充、边框、宽度和高度
  4. 内容改变——比如文本改变或者图片大小改变而引起的计算值宽度和高度改变;
  5. 页面渲染初始化;
  6. 浏览器窗口尺寸改变——resize事件发生时
var s = document.body.style;
s.padding = "2px"; // 回流+重绘
s.border = "1px solid red"; // 再一次 回流+重绘
s.color = "blue"; // 再一次重绘
s.backgroundColor = "#ccc"; // 再一次 重绘
s.fontSize = "14px"; // 再一次 回流+重绘
// 添加node,再一次 回流+重绘
document.body.appendChild(document.createTextNode('abc!'));

如何减少回流、重绘

  1. 直接改变className,如果动态改变样式,则使用cssText(考虑没有优化的浏览器)

    // 不好的写法
    var left = 1;
    var top = 1;
    el.style.left = left + "px";
    el.style.top = top + "px";// 比较好的写法
    el.className += " className1";
    // 比较好的写法
    el.style.cssText += "; left: " + left + "px;top: " + top + "px;";
  2. 让要操作的元素进行”离线处理”,处理完后一起更新

    1. 使用DocumentFragment进行缓存操作,引发一次回流和重绘;
    2. 使用display:none技术,只引发两次回流和重绘;
    3. 使用cloneNode(true or false) 和 replaceChild 技术,引发一次回流和重绘;
  3. 让元素脱离动画流,减少回流的Render Tree的规模