刘晓义(00:00:08): 我不太清楚我的腾讯会议之前那个直播是不是还是工作,就是我在我家 set up 的一个 youtube 的 forward homework 里头是工作的吧,我试试看。Hello. 大家晚上好!Library. 刘晓义(00:00:42): 怎么了。为什么我现在不能够。使用高级直播 Think to third party. 没有我加到 RTMP。如果今天的 TMT 还是不工作的小笔记本又要渲染,同时直播渲染,然后还要运行 powerpoint,那真是太糟糕了。 刘晓义(00:01:31): 直播 T? 刘晓义(00:02:26): 来见证奇迹的时刻到了!能不能从我加宽推一个 youtube 上去? 刘晓义(00:02:33): 即将直播。通过您的直播软件将视频发送给我们,即可开始直播。做不到。不是这是。 刘晓义(00:03:03): 是不是这样说不上去。打开 ODS。 刘晓义(00:05:24): 很对口吗。是出手很对。 刘晓义(00:05:44): 确实可以。还是个姿势? 刘晓义(00:06:07): 车里边有。 刘晓义(00:06:37): Where is the microphone? 几秒。 刘晓义(00:10:35): hello hello 好很好,我看看我这个麦克风是不是选的是对的,麦克风选的是对的。OBS 麦克风是不是对的。OBS 麦克风也是对的。很妙妙起来就是线上的同学们应该都可以看到。看看线下的同学。 刘晓义(00:11:02): 好,我们先开始。Slightly less. Important 的话题,然后我首先自我介绍一下,以防线上线下的同学们有不认识,然后我是喵喵。对。是忘了开摄像头了不妙。我能不能在这里加一个摄像头?我的腾讯会议没有共享屏幕。Share Gcl. 很妙。各位可以看我现场修理。可能会一看不了哪个摄影就是你直接共享的话,可能会看不到你的,好让我知道,我正在尝试加这个摄像头 video capture device 对,但是你不是投他心里的这个。你是吧,我看看这是我的 interpret 的 web。这是高级外?Yes. 你是不吃饭的刺激?我就觉得那个黑板的是我确实一会要在上面画东西,我怎么怎么切换视角,我学习一下。录播控制远程互动是近景远景近景我让我很现代,非常的好!这样的话,在线同学也可以看到我今天凌乱不堪的头发非常的妙,刚刚去北宫那边跑了越野跑。然后被暴打,所以现在是一身狼藉,然后看看腾讯会议 Join. 我腾讯会议。Sorry video. Fail to turn up radio. 他们两个会抢?OBS 会和他抢摄像头。那你就用猴?也可以这样的话我看看咱们的 youtube 上有没有人看没有人 youtube 上没有人看就 youtube 上有人看的没有办法服务降级了,不太好意思,还是 youtube 上比较服务 youtube 比较好,因为 youtube 的录像的话,大家可以已经在 youtube 上以后自由观看了。 刘晓义(00:13:39): 如果我们腾讯会议的录像还需要再下载咱们直播一下 OBS。我用 OS 怎么整,怎么把整出来对的。然后你就可以把它放在。是那样是让他看我的脸,我也没有办法让他,我记得有一个 view 啥东西来着,对,就是 OBS 会把 OBS 玩意再渲染出来,有一个东西。有点复杂。主要是他会抢什么。这下僵硬了。 刘晓义(00:14:30): alternative 能干的一件事情,你们有谁能帮我开一下 OBS 然后直播直接直播我的腾讯会议没有办法直接推 youtube 这件事情,尝试想修了好久了,并没有办法修好。啥意思我知道,那样的话不是大,那就需要大家调整一下什么吧,那就是我把这个事关我去 sort video obs virtual camera 是吧?能看到吗。Hello, everybody. 那这样的话就是在这个摄像头里有小的物,然后摄像头有小摄像头摄像,然后这个摄像头的屏幕里有一个小的物。 刘晓义(00:15:15): ok stop share 然后你们手动把它放大?缩放不对。不对他左右反过来了?我要怎么把它正过来 ok 是正的精度是糊的,那我还是开 share 然后。你看这件事情比较拧巴了。 刘晓义(00:15:56): 大战 OBS 不是他不是有一个什么高在 OBS 这边,腾讯会议这边 wow 高清摄像头 video 里面。hd video 这有用吗?够了,能看清了 ok 很好 nice。那就。大家好,那我们就这次正式开始,还是没有到重重新定义七点钟的地步,但是还是7:07看看。 刘晓义(00:16:35): 通达技术群里面有没有?那技术群里有个当前页面的脚本发生错误 anyway 那就我们正式开始这个热烈庆祝,重新定义七点钟并没有重新定义七点钟,今天是准时开始的,7:08还是七点钟,那就是首先我继续一下我的自我介绍,然后大家好,我是喵喵。然后喵喵我是从一年半之前开始担任出纳的会长,然后到现在为止总算能够熟练的讲解这个 P 的这个 slide。然后在座的有很多同学也是至少听过我讲过三次。然后甚至有一些同学是自己讲过,所以就是我今天还是再给大家讲一遍,然后看看让大家看看有没有进步。 刘晓义(00:17:36): 高出纳这个词基本上就是介绍一下我们社团的这种基基本的情况是怎么样的,然后在座有多少新同学请举手,有一位新同学有两位新同学。很好,欢迎新同学的到来,然后希望能够给你一些对于我们社团更多的认识,就是出纳两位新同学之前用出纳的镜像站用的比较多吗? 刘晓义(00:18:02): 我也没有用过镜像站,但是有一位同学用过镜像站,我们这边主要做的一件事情是做的相当于知名度比较高的,然后做的比较完善的一件事情是?清华大学的一个开元音像站是由我们这边维护,然后一直以来的很长时间内是很多开源软件的发行版,在国内的顶级就基本上就是我们会首先把他们的软件,包括它。如果是一些开源软件,它有二进制分发,我们会把它同步到国内来,这是国内的第一个第一轮服务器。国内其他高校在从我们这边拉之前,我们这边的流量会非常大,但是现在国内有很多其他的高校,事实上是和我们在一起在做我们自己运营的镜像,包括出纳的镜像站,然后还有 EFSU。就是北外的进场站这一行现在可以暂时删掉,是之前特纳运行的镜像站。除此以外,国内其他高校办的比较好的一直是科大的经销站 U STC 进行站在17年左右,我反正我当时高中的时候用清华镜像站的时候,如果清华经销站挂了,我就换到科大经销站,如果科大进行挂了,我就。我换到原来那个园,然后去睡觉,然后看看睡一觉,醒来之后它有没有下完这个相当于国内最早的两个进行站。现在的情况是上海交通大学,然后。 刘晓义(00:19:21): CY 你们那边现在整的怎么样?能用。 刘晓义(00:19:39): 是对如果大家感兴趣的话,可以看一下我们运营的一个网页叫做 mirror。neuro 这点是由一个托纳之前非常活跃的成员,他的名字命名也是他当时代理开发的,所以就是。虽然他现在不太在冲他这边活跃了,但是我依旧怀念他,所以就是可以看到现在国内市场有很多的进展,然后我们也很开心,我们是一开始在做这件事,然后现在能够做这么大。 刘晓义(00:20:13): 除此以外,刚刚是知名度比较高的,已经说完了,好像就没有什么别的事情了,也不是对于消费的同学们,还有很多其他的福利,然后有某种角度上来说,这个是我们自己弄了给自己用的,这个可能是我个人用的。 刘晓义(00:20:29): 比较多的东西是托纳有1个 DNS 解析,就是我们都知道国内的顶级 dn S 一般会对很多的东西做污染。大家经常比如说经常访问一个网网站,然后他会告诉你说证书不正确,然后是 facebook 的证书,然后让人摸不到头脑是怎么回事。是怎么回事,是比如你访问 google 的时候,他把 google dns 污染成了 facebook,其实我也不能理解为什么在做这件事情,因为 facebook 也是被强的。但是反正就是国内的很多,比如114的 DNS 是做这件事的。 刘晓义(00:21:02): 怎么解决这件事的方法是欢迎使用我们在校内的出纳自己的自建的这个 DNS 这个不是镜像,这个是一些我们一会说一下这个东西怎么实现的,反正很神秘。好记幺零幺点六,大家直接把它填在你的 linux 里面就 system resolve D 或者点 com 里面,然后在 windows 那边就设置一下 DNS 设置改成这个,然后 v6也非常好2008200180。 刘晓义(00:21:32): 666没了是六美元 ok 那大家先用 v4,然后 v6的话就永远怀念现在互联网倒闭了。我们回到上一代互联网,DOT 就是 DOT 和 DOH,在国内校内还能用至少 D OA 是可以用,就得换一个8443。就是43在校内也可以用,就是比较新的 DT 怎么弄到下面比较新的两个 DNS 标准就是它会从 HTP 和 T OS 走,就是这个东西更安全一点,非常安全,非常 secure。你只要信任我们的证书就好,我就可以帮你里面灌入一些恶意流量,也不是灌入恶意流量,我们最终能做的就是只是给你回一些错误的 DNS 解析。 刘晓义(00:22:16): 东西怎么实现的东西实现方法就是大家想象一下 DNS 常见的一种实现方法,就是你要做,比如你要做一个代理,我是一个代理服务器,他问我 DNS 是什么,我转发出去回来给我再回给他。对一般是这样的,所以有四票,我们这个 DNS 可以只做到三票。大家可以考验一下大家的既往知识有没有既往高手就是知道内幕的除外,在座的这个管这个 D s666的不要说话,然后除此以外的亲友能不能猜测一下线上的同学们也可以猜测一下。可以直接开麦发言。 刘晓义(00:22:57): 我是不是选对了,我选对像做了三票,有没有亲友想法总不能直接,原来是因为我们在外面那台服务器上 AS 边界上,所以才可以干这件事。因为他在 AS 边界上,他可以假装自己是别人对的就是真正的互联网,我们你们在清华里面用的都是内联网,这个是真正的互联网,然后这个 DNS 之前出过一个段子。 刘晓义(00:23:31): 有一些大家可能在用的软件。就是有一些不妙的看狂徒的本子软件使用我们的 DNS 去。去这个就是 cold 了我们的 DS,然后做这个抗污染是因为黄土网站会被污染,然后当天的情况是,我们有一个建行管理员叫坏人。他的真名就是坏人,他真名其实不是坏人,但是我们都叫他坏人,他具体叫什么的话,如果他没有在现场的话,他不出来澄清,那他就叫坏人。好坏人当天起床一看。 刘晓义(00:24:15): D s666的我看下面有没有?D i46当天的流量暴增是因为之前666只有校内的同学可以用,但是666突然在当天打出了非常高的流量,个人觉得这件事情不妙。当场把他的 UA 掐了,然后就这件事情就被交上了软件的 issue tracker 软件。 刘晓义(00:24:42): 然后这是他的其中一个 fork,然后反正就是这是当天的流量图,这是那几天之后的流量图,其实是大家可以看到有非常明显的尖峰,就是这个网友们在做什么都可以猜出来。然后 anyway 然后这个是一个特大小故事,说明这个特大提供的软件,即使是校内的服务也是非常重要的。那还有什么 NTP 这个是 tier two 的 NP 我们是直接和一个原子中做 P 的,所以就是原子中那边是 tier one 所以我们这边是 tier two。 刘晓义(00:25:17): 这个是在清华里面,有的时候你使用 microsoft 的 ntp microsoft 是不会超时,就是 windows 默认那个 NTP,然后你就收不到准时的时间,有没有办法准时的加一秒?包里面其他的好像几乎都是不可用的状态对很多,比如说的默认的就是很难用 a 点 time,那个东西就是基本上连不上,所以大家可以用这个。很好。对关于这些资源,如果大家以后想复读一下的话,就是在我们的主页上都有。 刘晓义(00:25:52): 是我们之前用的比较多的,现在学生节还在用吗?哈利问个问题不用了,弹幕也不用了,因为因为前两年的时候硬件的东西坏掉了,他在那个学生节过程中突然就黑屏了,然后不能显示了,后来我们就把它换掉了,永远怀念。 刘晓义(00:26:08): 是我们做的一个弹幕机,就是之前在那些弹幕直播平台还没有流行之前 three twenty twenty seventeen 的时候,我们就做了一个弹幕的,然后这个是由一个。精英学长叫周宇翔,然后我们有多个实现软件的实现。张玉祥学长整了一个精英的硬件,实现你这个 HDMI 线往里一插,然后 HDMI 另一根线一插,他只有把硬件的字体给渲染上去,我一会要讲,然后。这个东西其实就是非常令非常高端,当年是宿舍比较早期的时间,第一次有一个人整出了这么牛逼的东西,然后后来宿舍上面接 VGA 就变成了一个。必要的环节。主要就是现在已经没有人能看到他的对的,然后这个张玉祥学长还干了很多其他的事情,大家现在既主要造计算机,也是他统帅的,或者说他至少要负一定责任,然后大家那个宿舍的书店的那个小模块是他的。是他的作品,我不太清楚是毕设吗?什么可能不是毕设就是他整着玩的东西,反正就是特别厉害。张玉祥学长看看张玉祥学长在不在线。他估计不在线,现在还在加班 anyway。 刘晓义(00:27:32): 然后通纳有群聊,我们在招新的时候开玩笑说我们是群聊社团,然后智商也是群聊社团,我不太清楚在座的两位新同学有没有加入我们的通纳技术群。如果已经对的,如果已经加入的话,可以给你们拉进一个小群里边一会拉一下,然后这个是。 刘晓义(00:27:53): 群聊,我们本来是希望能做的一件事情,是大家可以以多种多样兼容并包的方式去聊,我们有那个 IC 使用者叫西本拿老师非常钟爱自由软件是真的 developer 如果大家真坏了。就想办法 email 他在群里艾特他就好,他喜欢用 LC。然后所以我们最开始之前,有 IRC 的桥以及网页,所以我们叫 U 飞书,我们点出拿点某某。后来爆炸了很久,然后又回来了,又然后又没回来,所以他说坏了好了很长一段时间,现在是没我们现在暂时使用 matrix 就是我们最开始的想法是把它接进微信里面,但是后来微信的围墙越盖越高,我们就接不进去了。我觉得现在微信是一潭死水,反而是在开始官网上,大家每天在聊这件事情就没水喝很大,这个他们说什么这个资金。把这个柜子给你关了,那这个又可以工作了,又要找新的灵车轮子,这个铃车轮子总是存在的,我不担心这是现在的前端,反正是。扩大技术学非常的好,然后刚刚我们去看的这个网站对这是熟悉的,群友们可以看到可以非常熟悉,这是我们一个什么,这是叫 collection,里面是我们很多。 刘晓义(00:29:30): 群聊截图群聊切片,大家如果看管人的话,就是图纳的管人群聊切片。我把前面灯关一下。是这样的,这样是合理的,对,这就是粗纳的切片,大家可以推一下,然后里边有很多我们群聊里内部的段子。比如说有一些非常 inside joke 的东西是在非常早的一次出纳活动的时候。这个发生的一件事情叫做没有想到大英是非常早的11位社长,没有想到大英他居然携身携带网线,然后康哥是另外一回事就掏出了一根网线对,然后今天也没有落空,是因为我们之后的每一次活动只要提到了。这个6p6c R g45总有在场的人会有网线,这个今天屡试不爽,今天也验证了,然后大家可以阅读一下里面那些其他的故事,然后这个是我们。精选的一些群聊,最近好像还没有人做切片,可能这个已经是 dead。Anyway. 然后托纳也获得了很多的荣誉,就是除了我们做的事情在社会上影响力比较大了以外,我们还荣获过,这是第一届。唐浩强计算机教育基金优秀团体奖非常的牛逼,首发此证以资鼓励现证在哪?法律是放哪块?有扫描件,我们是群聊社团,数字有数字的键就是总总会在这个数字证书是靠谱的? 刘晓义(00:31:29): 除此以外,就是我们当然每年的活动其实说起来比较不好意思就是我们每年活动百团招新是非常大的一个活动,我们希望就是技术交流能够多进行一些上个学期类似这样的 tonight 的技术交流,一会我会讲 tonight 就是我会讲。 刘晓义(00:31:47): 之前预告的之前上个学期的问题是上个学期是忽然讲了一大堆,然后上个学期就是大家都没活了,就没有题目了,所以上个学期只办了三次 T 希望这个学期现在已经有六个人给我 schedule tonight 了,然后他们纷纷在第一周估掉了,上周并没有非常的遗憾,有一个孤独的人就坐在现场。对正在看着我这个笑容非常的漂亮,希望他能尽快准备好他的给我们来分享。也希望至少我们今年能够有更多各样的话题,在这里来聊,因为我个人是非常喜欢听大家讲出来的。我也是个人非常喜欢讲自来,我可能我是我现在是算是讲的比较多的一位群友的,然后我们今年估计还会有一次咖啡馆小聚,就是如果上半年已经在的各位同学的话,上半年年初的第一次活动是一次咖啡馆小聚,就大家一起去吃吃喝喝玩玩。今年是会今年还会有一次吃吃喝喝玩玩这个可能还是我是小喵喵的时候。这是我本人。现在已经是老喵喵了。 刘晓义(00:33:10): 然后还有一些这是一些知名群员的照片,然后 perl pero 现在美国攻读博士,这位是杰哥,还是在每天在镜像站上写 commit,但是在线下活动已经见不到他。ok 然后刚刚是一些日常的活动,从那现在每年会固定有一次,或者说我们固定会有两个活动,有很久没办了,但是那个也其实我们的一个传统,首先第一个可能跟大家比较相关的是 OS PP。是类似于 google summer 的一个东西,就是上面会有各种各样的,无论是公司还是开源社区会 post1些项目,然后会有导师带着大家一起去做通纳也会 host,今年也会有。现在正在项目征集当中,无论是想提项目还是想去做项目的,到时候也可以关注一下。然后还有当然现在正在做的事情,说奶奶。这个是很久之前的 tonight 好,然后基本上就是这样,我们 self introduction 两位新同学想做一下 self introduction。要不如果说做赛进行,咱们就所有的同学依次做一下。你要想当新同学可以当新同学,那就我介绍完就由你介绍好。 刘晓义(00:34:37): 那大家好,我先自我介绍一下,我是喵喵。这个喵喵。谢谢大家。全体好。那就由你开始正好是最后一行了?挠头我是阿贾克斯那个群,群名如此,然后董叶凯现计算机系科协网络部副主席。虽然我觉得网络部马上就要倒闭了,可能没有下一届副主席。说不定我是最后一天。然后没有了,谢谢大家! 刘晓义(00:35:24): 大家好,我叫潘淑佩,我在电子系今年就博士六年级,然后我从来没有讲过 tonight,但是我经常来听 tonight 和找人聊天,其他的没有。我叫于继平,如果你在群里面看到一个二饼,那就是我的,然后现在是计算机系高年级博士生。不会有比我还高的,然后你是不是搞什么,你们组 L 大夫主要是谁管?这个当然是一关的,他能毕业吧,没有那有一个很无聊的笑话是管了的人都不能毕业,然后这件事情有两个方面是会非常的稳定,另一个方面是这个人没有办法毕业,然后。至于更微 happy1点,大家可以自己选。 刘晓义(00:36:31): 我叫王子路,我还没有进群哈,我是严玲,我下个学期入学那个苏世民书院,我是学文科的不是技术背景,但之前在那个大厂在阿里做过产品经理。然后自己会做一些套壳的大模型应用什么的,很高兴认识大家牛的牛好,大家好,我是5000收 tx a5000,虽然这个群名可能。活不了多久,因为感觉现在因为大家先看了价格越来越玄妙了,然后我是计算机系的倒闭,博士生很高兴认识大家。 刘晓义(00:37:24): 大家好,我叫 ash gray,但是在群里面比较潜水,然后我是清华药学院的学生,虽然是药学院,但是我是比较喜欢降级,然后了解到出来,然后加加到那个技术群里面。自己本人的话比较喜欢前端和牛,咱们这边技术也非常的各种各样的群友,什么技术都在用,然后系也特别多,我这边在座的有电机系的同学。也可以算你多少有点过分。 刘晓义(00:38:04): 大家好,我是海瑞晨,我是已经十多年的老老群友了,就感觉现在做着的就总总是每年换不到超过10%的人,然后感觉这个现状每年都更不容乐观一些。但是我也对此没有什么办法。怎么怎么坐那么远,但是至少来自外面的亲友变多了。更好玩。刚好我叫黄路坚,我也没有技术杯。 刘晓义(00:38:51): 你是哪个学院的,大家好,我叫黄路坚,我是北京大学历史学系的硕士生。我本科读的本科是浙江大学毕业的是读过最后,从物理系和计算机学院取得了学位证,取得毕业证。本科我的技术。不差不多这样吧,我比较感兴趣的方向是那个素材板和隐私计算,然后是可能也没做过什么很系统的工作背景方面可能比较薄弱,在这里主要是和大家一起聊天比较愉快,不是那你不就过来今天打我场子来的吗?怎么回事? 刘晓义(00:39:37): 大家好,我叫陈阳宇,是一个外校的博士,三年级学生做秀,然后再做一些一些软件协同的一些程序优化的工作,然后也贡献过很多开源软件,然后也在我自己学校在维护经销站。很高兴认识大家。 刘晓义(00:39:59): 大家好,我是 N n708我这个电我是电子系的国四的学生,然后日常特别喜欢使用这个 arm 的设备。当然目前主要还是 apple,不过今年就能用上国产的主线支持的 R k3588。对我很好奇,我现在想有没有办法整一个 arm 的 home lab 有什么推荐,我跟你说听不到你的。对我觉得你说的非常有道理的问题,不上 linux。永远怀念阿!夜猫还是可以的。自己给一些 D base 系统做 arm 移植牛,那你和你坐你身后的那位 developer 要不要聊一聊? 刘晓义(00:41:08): 大家好,我是 paper snake 两年前是计算机系的科协网络部副主席。这下完成了对,然后也是最后维护目前的弹幕机的开发的人。差不多两年,也是两年前维护的,现在好像脸上是有个爆炸了吧,好像之前说我大概会修,但是目前在哭的状态。叫被移除了,毕竟时间都是可以好好真的有人在用那个东西。 刘晓义(00:41:50): 你在镜头上抓一下,看有多少人下 anyway,那就先这样,然后对于线上的同学们,我先关一下麦克风。 刘晓义(00:44:34): 好,然后我回来了,线上的各位大家好!那开始今天的我来讲个东西吧!在哪里。在这里。稍等一下,给大家展示一下 PPT 卡拉 ok compile 出来 layout did not converge within five attempts what**。这下没有关系我们即使没有 converge 出出了?错误消息感觉很美开。感觉就差不多了。我很妙,非常好,现场的同学们都可以看到吗?看起来就可以看到就 ok 想换种境界。 刘晓义(00:45:37): yes 好,今天咱们来讲数字文本渲染是这位群友大家管它叫拿就可以拿的专项,那就是今天由他帮我来做。fact check。我讲错了什么东西,请由他来说。对,然后首先说一下为什么要做这件事情就是这个动机很奇妙,你作为现代渲染,我们已经有了很多东西,你有 typist 你有 PDS。你有 one browser。Firefox. 什么 age 虽然我不太想提这个名字吧,但是也是存在什么 chrome 这些东西,然后底下的裤袜子这些东西都是有的,为什么我还要再做一次?为什么主要是想做这个效果是如果想打广告的话,就是我正在写的新博客,每年我都会先写一次博客前端。主要就是写这种东西,因为你要写这种东西的话,结果就是你必须要把所有的方特都去做一遍?因为显然现有的方特雷奥是不支持你把字给拆开的,或者至少在苹果整出它那个新活之前是不支持的,所以就是这个是 primary motivation 我们要做为什么要做这件事,然后。 刘晓义(00:46:59): 怎么做为现在的自己渲染大概是怎么样子,就是我们可以回忆一下高中有这个东西,这个叫 central dog 中心法则叫中心法则吧,我 DNA 转录到翻译成。这个蛋白质我们可以把这个模子给套到所有的东西上,虽然说最近四五十年,大家一直就在觉得这个东西的模子套不进所有的东西了,但是这个还是一个很有效的法则,我们少一个字环 DNA 可以做复制? 刘晓义(00:47:27): 对应的在这个渲染上面也有一样的东西,就是我们有 code code point 是什么,就是一个字,比如说喵就是喵,要渲染的话就是一在计算机里表示会是它经过了一个过程叫做 shipping。父字形,它会变成一个东西叫 glass 是一个就是 leaf 它会变成一个。某种角度上一个字就是已经写出来了一个字,我们经过一个过程,这个东西叫 rasterization。然后大家如果玩过老游戏的话,这个东西会叫栅格化,就是它会这是一个。向量的一个东西会变成渲染到屏幕上。所有的 pixel 这是当然就是我们自己渲染的中心法则,你当然这里也可以有一个字环。我的画图软件不支持我画一个字环,那这里也可以有个字环叫做 ring code encoding 换来换去画。可以基本上是一致的,这个说明计算机科学也是21世纪的科学,所以我们今天这个 talk 希望能够回答这样一些问题,这样一些可能大家不太会遇到,但是。非常重要的问题就是当你遇到了之后,你会觉得很头大的一个问题,比如说我们怎么生成一个字体子集,大家在做前端的时候,很多的时候,比如说我们字体特别多大,然后你想做中文的外。 刘晓义(00:48:50): 我怎么做自己子集?回答一个问题,为什么浏览器这么慢,浏览器渲染的时候,为什么我们有一个几千行的列表在 android 上面,它就是工作,但是 chrome 上面就是不工作。为什么乱写这么慢,还有 what**is this 这个是我今天在 firefox 上面截的 fox 的那三个字,然后把它放大再放大。这边有一条黄的找一些蓝的,这是什么,有这种东西,就是这个东西。一开始我最开始观测到我第一次学习到这件事情是很久之前用一个现在已经不存在的 ID 叫 eclipse。eclipse 先做的是 S d2实现。为什么会有这样的东西,为什么我们把一个字给截完图之后放大会变成样,那我们就从头开始说,刚刚说了一个中心中中心定律,那我们就从最开始说文件存储和编码。文件存储文件文字是怎么数字的方式存起来的,显然的回答是,当然是存储在硬盘内存和云纸上,你可以把字写在纸上,放在云上,清华云盘,但是除了这个纸以外。 刘晓义(00:50:05): 我们都需要回答另一个问题就是我们怎么去存它通常来说大家使用的东西。这个叫 UTF 什么?为什么我们有时候会看到这个符号?这个渲染化了,这是另外1个东西,这个说明 unicode 还是不 robust unicode give us 一些很神秘的 emojii,你可以把 emoji 拼起来。各种各样的阴谋就拼起来就是一个很好的东西,就是它基本上把现在字符的数字表示都整合在一起了。所以我们从某种角度上来说,巴别塔已经建好了,世界上所有人都说的是一样的语言,虽然说每个人说的就是每个国家说的都是每个民族说的都是这个语言里的一个子集,然后子是不交的。但是从某种角度来说,他们是同一个语言,这个巴贝塔已经建好了。 刘晓义(00:50:59): WWG 是 hypertext 工作组对 unicode 大家称赞说 now military encoding for all things。这句话出现在哪,是在喷 b5的 encoding 里面用的这句话。但是他在真的在写的时候并没有夸他,就是只能。你只能大概品味一下,他可能不愿意特别表现出来自己的喜爱之情,但是还是很喜欢 unicode 的具体是什么?他干的一件事情就是给出了这么一个应用射。 刘晓义(00:51:31): 一个抽象的字符,比如说字符马位这几个字,我们给它附了一个 ID,就叫 C,所以就是这样的一个映射关系,我们相当于就是给世界上的所有语言,所有文字,那叫 script 所有写写的文字里面的每一个所谓的字符都给了一个代表它。很好,非常的妙,解决了数字存储问题,我们既然已经有统一的这样映射。为什么就是我们需要区分的一件事情是字符集就是码位的分配,每个字是给的码位和编码,这个码位数据存储有区别。 刘晓义(00:52:14): 从某种角度上来说,我们用计算机的话有很多种二进制不同的表示方式,比如说 unicode 就有很多表述方式有 ut f8这个 unicode transfer format。八的八个字节,八个比特为1个单位,所以它是一个字节,一个字节存最早的 unicode 是 ut f16,因为它一开始 unicode 是从 UCS 这个是 windows 整出来的一个活,就是那个 windows 上 Y 一开始是 windows 整出来一个活,从这个发展出来。大家一开始用的是 ut f16。我印象是还分两个版本,当然有小端序和大端序版本学的计算机体系结构的同学就会很熟悉这件事情,哪个这个16字节16比特两个字节的数,哪个存在前面哪个存在后面?然后还有点32.32,也有很多端续的问题,然后还有其他的 rounding error,比如 G bkb etc 这些东西 running arrow 就是基本上没有人在用,为什么最后一行是 after running errors。因为其实 ut f16和 ut m32现在也是18年的统计发现在互联网上的传输基本上大于99%你可以认为其他司机基本上不存在 web 的角度来看,大于80%的支持就是 OK 已经是完全支持了,甚至就是你只要 chrome 支持完全支持了。对于 web 来说。 刘晓义(00:53:36): 所以从这个角度上来说,如果你只关心跨平台的传输,比如说你关心你的 windows 上的东西放在 mac 上,能不能看,一般来说,这种跨平台传输的用的都是 U t28。也就是我们只开始就好,尤其是我们现在 contact 是写外部,然后我们就只管 ut l8就行了。windows 上面还是 ut f16,就是如果大家用 windows 开发还需要用 W 的 handle。然后如果你用 rs 的话,这件事情非常痛苦,是因为你用 rs 的话,你就会有两个在后面的版本,一个是在 unix 上工作,一般都是 UT。f81是在 windows 上工作,一般都是 ut f16,然后这件事情很暴。难道不是所有的都不一定,海盗不是所有的语言全都会对的是我用 russ 举个例子,因为 rus 比较惹人恨!对是这样,但是你你已经用 SEO 说明你是一个 competent programmer,你需要处理 running errors 但是现在我的 context 我不是一个 competent programmer 我不处理 running errors 我是一个 web 要就可以了 it's good enough。It's good. 刘晓义(00:54:51): 所以是很大的一个问题,就是或者说之前是很大的问题,但是在 web 上面我们其实不太 care,因为在 web 上面它不是一个很大的问题。大家很久之前如果访问清华的一些网页还会有乱码,比如教务的网站,现在也会是因为他用了 G PK 然后现在的浏览器开发者从很大的角度上都会假设我们全在用。what whatever 所以就是对。只能说明现在浏览器的开发者都不都和我的心态是一样的,现在下这个支付宝账单,他会给你一个滴滴快的自然富贵。那个东西还有很多,你在下载东西的时候,它会把那个文件名义 GDK 的方式编码,然后发给你的浏览器,然后你浏览器就会下出一大坨的,其他是这样。 刘晓义(00:55:44): windows 还是 G PK 吗?windows 不是默认他用的是搓,那反正你老看话!中间就是咱们之间默认字符集是 ANSS 还在那个区域上面就是叫默认,但是 windows 你说 windows86。他用的就是 N YFL P 如果你有付费了的调用它所有都有16就没有问题,对我的印象里是现在 windows 做的还挺好的,就是基本上10之后 windows 十之后至少所有文件系统那边都修好了。不会再有这种情况,你至少复制一个文件,它不会爆炸的浏览器,然后就是拆字符集是一件难的事情,我们一会提到为什么它是一个难的事情。 刘晓义(00:56:43): 酸吗?另一种是它标了它直接那肯定是一些乱码。对因为事实上很多的时候就标这件事情是必须要有的,就是如果你用文件编辑器的话,它会叫 boom。一开始那个文件头,你需要标一下你是谁,要不然猜是一个很难事情,我一会说一下为什么猜是一个很难的事情,至于标错这件事情,那就没有办法,你说自己是 ut f16,但是你存这个 ut f8,那就。是完全没有办法,所以为什么要 ut f8我们 consider1下 ut f16就是 U CSR 之前那种它的第一个问题是,它不是 ask compatible 这块 ask compatible 是什么?你把。RP 的东西给边打进去,然后在中间看其中一字节,它有可能出来的是零开头的就是它可能是零到127的。然后他就是你这种角度上来说,如果你的传输传到了一半断了,然后可以拿出来一看,可能看到的是其他的一些东西,非常的不妙,然后它还有区分的 LED E 小东西,大家去支持的 play 比较少。 刘晓义(00:57:54): 就是这个 plane 这个概念是说 unicode 里面我们能放多少个就是放多少字吧,就是一共因为 ut f16的存在,现在 unicode 的最多还是只能存。最大是零差10F FFFF,那就是四个 f0104个 F,这是最大的,它能支持的马威,就是因为 ut f16的存在。然后它还导致中间有一块没有办法用说明它端编码的时候有一些 particularity 是把有一些高位给填在这个范围内,然后这样的话,你普通的低位就没有办法用,然后这个东西非常不好,因为八看的事情就很好。118的编码非常的简单,就是。比如说你就是那你 asking 你要是不是干的事情,基本上就是我们额外加加一个字节,然后我们在前面保证我们每个加的字节前面都是一这样它就不会混淆,从这个角度上就是我们如果吃到中间有个字节,它是那肯定是一个,然后我们抢的时候把其他的东西丢掉,只剩下的字符也很简单做你直接扫。然后就留这个就好,然后他去送长度也非常好算,就是你看直接看第一个的前缀一的个数就是它的这个字符长度,所以它去做并行的 ping 也非常好做,所以就是从个人角度上来说,这都是一个非常 nice 的一个字符集的存在。 刘晓义(00:59:21): 所以也是为什么现在绝大多数用的是 ut l8,然后大家也看到网上也有一些资料说怎么用 C 语言用去快速的,比如说对 unicode 去数长度之类的。这是一个非常 nice 的编码就是我可以多夸夸他,但是显然就是非常 ok 的第二个字节开始,为什么开头这个就是刚刚说的那件事情,它其实需要的是 self synchronization 就是你帮从这打断了。 刘晓义(00:59:48): 前面都会丢掉,然后你从这里看10肯定不是头10,不是头,然后这个地方这个头就是这个东西丢了一个字的话,你也很好看到这个东西丢掉,你看到这是四个,然后发现他们俩只有两个,然后你就数出来了,就是你只能说。 刘晓义(01:00:04): 丢丢丢,然后这个东西也丢,然后后面正好拼起来,那个时候才会出现问题,但是那个出现问题也不会 propagate beyond1个字符的范围,就这个东西就是对字符的边界,其实画的非常明确,然后这个东西的渲染的就是如果大家对密码学比较熟的话,这个事实上很像 block 的。 刘晓义(01:00:22): content 模式,你把你的错误扩散给限制的非常紧。Anyway. 这个非常好,也不夸他了,那接下来该骂了就是 unicode 那你说最大的就是支持010现在就是你说整整整 emoji 那一套,大家就是。 刘晓义(01:00:44): 搞出来二的几次方了,那你说这么多字符怎么存下这个有个东西叫做 zwg sequence 为大家在 JS 里去执行1下这个 R 一点,这个其实刚刚想画那个地方都画出来了。那如果去跑一下这个 from 就是相当于把它当一个 character character 的话,我出出。他说厨师这些东西是什么?这些东西是妈妈,然后白肤色,这是一个叫 zero with pointer。肌肉的概念也会提示什么?joiner 就是把前的后面拼起来,语义上拼起来。大家如果看过中文拼字的那个东西,就是你有的时候你用中文去写一个就是它的 emoji 有特殊的 code point 专门编码,比如说我是一个偏旁可以入手,就是左边一个偏旁,右边一个偏旁,你可以往里拼别的字,它渲染的时候就会把两个字拼起来。那种方法可以拼出来,在 unicode 里常见里没有编码字,比如表,你可以那么拼出来就是用很多这个东西叠起来,这是一样的。ZWG 把他们两个拼起来,然后你在语义上就是这是一个两个母亲,一个女儿,一个儿子的家庭,然后他们是白肤色的,每个人都白肤色。 刘晓义(01:01:58): 有一些很逗的效果,比如说第一。第一件事情。我把夹在我的脖子上。我们复现一下这件事情。我在这里准备了一些提前准备好的文字,专门用来复制出,就给大家展现一下 unicode 的扭曲之处。复制。我复制一下就炸了,哈哈。直接就炸了,直接把这些整行都复制出来。Copy. 还是那种树枝出来就长,我很妙,不是很妙,对 terminal 有问题充分无法显示,但是我之前 terminal 是可以的,展示主要的一件事,你可以把这个数字给改掉。你把这个肤色改掉母亲的肤色就会改,那这件事情就是首先幽默的一件事情。第二,幽默的一件事情是什么?刚刚,你可以逐个把他们的家庭成员删掉。 刘晓义(01:03:31): 在这里就少了一个人又好了这个,然后你会注意到这个东西删除还不是按 cos 的删除,做了一些支持,他把一个人删掉。他的把一行删掉,这就是说明他资料的知识,然后他特殊是可以让你说正好删到上一个 CSD 的位置?整齐齐整整!这个不知道,第三个幽默的地方就是他的换行显然是有问题,你你你。你可以把他们的家庭拆分开,我们为什么会发生这种事情? 刘晓义(01:04:25): 对的 unicode 的标准是不能区分这件事情,至少现在的科技上来说,你在所有正确时间 unicode 的平台都会出现。你这俩人为什么金,我还真不知道,因为底下两个人是孩子,是就孩子这个语义上是没有对可能拼不起来对这件事情。是不是旅游和旅游 SAU 可以按照他是怎么样用,一会一会我说一下这个东西为什么现在是不太工作。画这三个人的方法和去描述某一个人的视角,不同的通路就是1个是 gpose,一个是基萨布。对不太一样,那就是我们现在基本上说完在硬件上存,就是我们大概知道了 UTF 是很好的一个东西。为对它是把字符给编码就是 unicode 是把字符编码的 code,然后我们再把它以 ut f8的方式存成二进制。但是有一些 particularity,比如说可能会多用多个字符,或者他可能对应半个这种情况下,就是你在这里某个角度上,你可以这么一个人的字,这里一个肤色就是半个字或者其他情况。 刘晓义(01:05:49): 接下来一个 logical 的问题就是我们怎么至少你在渲染之前需要至少就是你在把这个字给放到屏幕之前,你得知道,比如说这四个人拼起来了,或者你得知道说。这个字符大概要长什么样子,哪些 cp 的?现在既然已经可以有多个 cp 要压缩在一起?这是一个理性上来说的下一个问题。那我们接下来讲,shipping 好,我们 shipping 就是将字体和文字转换成排版与字形的过程。 刘晓义(01:06:25): 为什么我已经开始谈字体,这些不太对劲,我们刚刚还在说扣的事情,还在说多个字的事情还没有到渲染 it turns out 字体里面是需要和字符集绑定。就是你的字体需要知道字符集从某种角度上来说,不同这块的字符集,我们只编码就是比如说你有的字体真的是不支持 unicode,只支持 G PK 这件事情是存在的,或者 mice versa 如果这种东西存在。 刘晓义(01:06:54): 那你的操作系统就需要帮你去干这件事情 linux 显然是躺平的,但是就是 GDK 就需要做这件事情 windows 显然是做了一些这样的事情是。open 的一个标准就是它里边有 iphone iphone id 是 windows30windows。你看一下后面你就大概能猜出来,这是 windows 的扭曲世界。encoding 是什么,有 unicode 的 BMP 这是最基本的 unicode。SHIFT GS 这是 GIS 然后 SHIFT GS 是什么,就是大家就是日本的那个 encoding 他去 shift 的128个就是他 shift 的127去把那个给避开始就是 shift。我忘记是不是 shift127了,就是因为日本的日本人去编码的时候没有管美国人的事情,然后两边就不能打第三次世界大战,至少为了一点更有意义的事情打,所以就是 SHIFT GS。Prc. 为什么不叫 G PK 不知道 b5这个我不太清楚是哪个,然后我也不太清楚。不好意思就是反正就是有1些很幽默的事情,这个是 windows 这边的字体就是这是 open type 里面的定义 type 一开始 microsoft 做出来的,像 microsoft 最开始从 type type 变成 type type 相对应用比较广泛。所以就是字体里面需要考虑字符集这个地方是在哪用到叫 C map table 是因为每一种不同的编码,是指编码的 code point 就是我们虽然在二级上有不同表达,我们最多能干的事情是把它转换成统一的 code 这是在某一种字符集里边,某一种编码里面是统一的。 刘晓义(01:08:30): 然后我们把它给变成一个的 GLASS ID 的东西,这是字体里边的就是一个画出来的文字 glass,然后它最多是16个比特。现在的 open type 字体最多可以支持65536个字。然后伟大的四元宋体和思源黑体虽然很丑,但是它支持65536个字,就是他去基本上把 jar 多数使用到的日常使用到的汉文日文,然后汉字,然后日日文韩文的那些字符都包括进去。不日常使用到的话你就需要去用一些别的自己造的自己。他的它的格式大概是什么?面试 ok ok 格式大概是什么?就是这是一个映射表,它是一个。这是说马马位一开始的位置和结束位置是一个 range。然后把这个给映射到从这里开始的 ID。是非常简单,这就是一个压缩过的反列表,它是一段映射到一段非常妙,那你说下一步就是你这个逻辑上。 刘晓义(01:09:33): 更好的下一步就是去把那个 ID 变成 graph definition 就是这个东西怎么画。这个 FID 会经过另一个表叫 loca location 表会直接索引到字体文件是一个二进制的字体文件就直接索引到中间那个 offset。 刘晓义(01:09:48): 然后就是把这个东西读出来了,这边有什么这边一堆 basic curve 的控制点是什么?就是那些 vector 的图形,你们就画出来,比如说你,你画了一条直线,它就给出这个点和点的坐标,一个曲线就给出这个点会提供一个控制点的坐标,控制点是拉曲线的形状的。 刘晓义(01:10:09): 好,怎么一看就感觉已经解这个问题已经解决了,非常的妙,什么事情都解决了,是不是就可以直接画了?好像不太对你如果打开 open type 的标准里边很你,你有可能看到这样一个评论,说是 the the true type instruct ion set 品一品这句话。 刘晓义(01:10:35): 这个名字叫做 the true type 指令架构指令集好这个大,大家可以开始慌了。这意味着什么,这意味着出 type 里边去有一个虚拟机。之前有一次苹果 IOS 的越狱就是这个虚拟机的 G IP 挂掉了,然后导致里面可以执行非法代码,然后就对很久之前的事情了。但是这件事情。里面是一个 battle 的 engine,就是你想画个画,他说你不能把每一个文字的所有东西都存起来太大了,怎么做?搞了一个可编程的东西在里面,这个里面是一个 instruct ion set,这是第一个不太妙的事情,但是它也不是严格不妙的就是如果你打开。GTFP 这是去用心写的 GTFP 非常的好用,如果大家以后从就是你有某种原因就要 handle 自己的话,可以用这个东西非常好。你打开 tables,然后你打开它的 glass table 的实现也可以看到烟 Instruct ion. 你说是 S 的?Ski Instruct ion bicycle. 看起来就非常的美妙,这句话就是意味着我们不处理这个 instruct ion ble 主要是用来干什么?主要是用来做 ping,一会再说在干什么。在渲染的时候会有一点帮助,所以这个 instruct ion code 都跳过了,非常的妙,这个事情至少解决了很好。 刘晓义(01:12:12): 我们市场有很多事情没有处理完,Dangerous. pictures 是什么?pictures 是?比如说你不是 cjkcj k1般没有这个核,那是别的文字,你需要把多个 G 拼在一起 FI 还要从 F 的下竖排,需要把横的括号换成竖的括号。还有阿伯文阿拉伯文是最典型的例子,在这个例子里就是你有多个 gap 在里面的时候,有可能你整个字形都会发生变化,这个东西就是。更多的时候大家会看到的是刚刚的我搜索的这个东西就是你编程的。对于在座的同学们可能更多的时候接触的是这个东西。我们家的这个东西实现就是用 open hype 的功能实现,他让你可以去把各种各样的符号给拼起来。然后变得好看一些。 刘晓义(01:13:14): 下一个问题是坑 Caring. 是这样一件事情。这里没有吗?这个 gpos 里面是有的就是 company 的一个主要问题是,比如说一般来说去处理一个就是最典型的例子是一个 W 和一个大写的 W 和一个 a。如果能放大的话,你仔细看 a 其实在 W 的。右边那个小小小报的下面我看一下怎么把这个变大还有个 G。不要泄漏的。 刘晓义(01:13:51): 1个大写 W 一个小简历,然后我们把它变大。所以你仔细看的话,这个 a 已经到这个 W 的下面陪你们翻下去。是 king 的工作,就是如果你不做 king 的话也会非常丑。就是其实你把光标放在这看得非常明显。光标已经和有一些重叠。 刘晓义(01:14:09): 这件事情在古典的做法里,它是用 K 就是之前大家还是手动排版的时候,这个操作就叫干的是什么?是把两个字体中间的那个木块也弄小一点,然后把它给压在一起。然后你印在纸上,他们两个字就挨着近一点,这个叫做在数字排列中,你需要做这件事情,但是它会变麻烦。你看到的 W 在数字上,它只不过是一个马位。然后你看到 a 也是一个马位,你怎么知道两个东西需要这么急?是一个需要解决的问题。This doesn't layout. 这个字怎么放,每个字放在哪,这行可以有多宽?那小眼圈长啥样,都需要解决,最后一件事情叫这是非常新的一件事情是什么?之前的字体,每一种自重都是不一样的。你可以重一些,你可以轻一些,可以加粗,不加粗。在 word 里面就是加速不加速,现在可以干的事情是可以平滑变化。非常好,这是你那你要做的话,你就需要至少有一些可以做插值的东西在里边,要不然做不了? 刘晓义(01:15:21): 因为你相当于你的微信,现在是用户输入之前字体就是你不能够直接把所有的这个字的里面,每个控制点都存成之前一样,形成一个坐标就解决了。事实上,我们刚刚提到的比较早的那个最简单的就是通过三个 table 的。 刘晓义(01:15:36): lu1个 C max table 看到格拉 ID 通过 lca 去找到文件中的位移直接画直接在 glass 表里画是最早的出 type 的实践方法,后来有一些。Evil Big Corporation. 去加入这个讨论,它的名字叫做 adobe,它引入了很多 PDF 里面的东西。如果大家熟悉 PDF 的话,可以知道 PDF 的前身是 go script。不是前面前是 postscript,是 postscript就是postscript 1开始设计,就是为了自己而设计!很多的时候就是为了自己这样设计的,然后这个时候就是你你会有很多的史就这样一起灌进的 open 的这个标准。然后 variable font 也可以认为是他们为了优化这件事情做出一个努力,就是消毒这件事情。然后我们刚刚提到了要的事情,这个是早期的博客在测栏的一个渲染的结果。地方很不作为一个中文的用户。校长非常的不对,现在校长长样。都对一些你的字就要跟着跑到这里,你的书名号是不能单独换行的。就是谁支持的,这东西也是和字体相关的 believer 这个东西具体怎么做,我们以后会继续提,我们首先就来讲这件事情。事实上,因为 layout 是一般是自己渲染最先做的一步,你想我们每个字在哪找出来? 刘晓义(01:17:02): 一般的渲染的时候,这一行会有一个基线叫英文的这边杯赛会更明确一点,找一张不好的图。这个会非常的明显,比如说有小写字母的话,就会跑到贝下面蓝色这根线就是贝,然后你所有的字都是对贝这根线对齐的。横着就是竖纵向的问题解决了,一般来说就是比较好解决纵向问题就解决了。在我们不处理多个不同的语言的字,横排混排的时候。 刘晓义(01:17:36): 当你有基线了之后,你只需要知道每个字去横着占多少空间?每字符会有个 horizontal advancement 会表示下一个字符应该向前前进多少,就类似于你的打字机里面的光标效前进多少,对于空格来说,这里有一个非常。特殊的例子,比如说对于空格,它的 horizontal advancement 是存在大于零,所以事实上空格的宽度跟字体相关,大家可以试一试,空格的宽度是不太一样的,换一个字体,空格就有可能会变成变的,但是 graph data 里是没有任何点,空格是一个空的东西。它里面是没有任何一个控制。所以说从某种角度上来说,graph data 和 horizontal advancement 其实并没有什么关系,这个东西存在另一个表里。通常来说,两种实现方式,第一个就是它存在的就是一个表 hm tx 就是有 V 放的话,这个东西会叫做 HB。或者他干的事情是有一个 phantom form 也是存在 HR 里面的一个点,这个点不在 glass data 里,就是它不画,但是它标记的是这个字体的右下角。就是最自己按自己的那个坐标的空间是左下角是零分,那就是右上角标记点的位置,然后它可以用 verbal access 去调这个点的位置,你的字的大小就会变。 刘晓义(01:18:50): 是一般来说做好的方法,你现在可以知道一个字横扇多少空间了,下一个问题就是那么多画行的问题,我们刚刚怎么去解决?怎么去解决丑陋的换行问题?这是 unit 的会参与的这个标准叫做 U ax14u ax 是 unicode standard annex 就是它的标准里面后面的字。然后这个 unicode 的那个 R 是必须存在的。然后我就把它复制过来,这个是 unicodeunicode library 是说的是啥,基本上哪些字里边可以划行哪些字里不能划行它当然没有说每一个字就是基本上会把。 刘晓义(01:19:36): 这里边的不同的 cos 给分在不同的属性里边,然后它会说每一个这种属性会需要做什么件,哪些事情有两种事情可以做1个叫 mandatory line breaks,一个叫 available line breaks mandatory line breaks 的意思必须画好。事实上,回车就是 CR 是 CL 还是 LOF 这样的,其中一个是用这个东西实现 CLLF 和 data 都是空的零,他们不会影响任何光标,但是他们会有一个 manager labrics 然后你在渲染的时候就是必须要换。事实上,从某种角度来说,换行这个语义是用的去告诉你,不是说回车这个东西特殊的对应的也是你容易考虑,可能有很多种不同的空格?有叫 white space,有叫 long break white space nb sp 像这些东西事实上也是跟这个有相关,比如说普通的空格是可以拦住。然后 NN DSP 是在连续的 VSP 是不能拦住,然后 available labric 的意思就是说,像刚刚说你可以不换,但是如果比如说这一行结束了就换一行。 刘晓义(01:20:47): 特殊要注意的一件事情是它换行是这个字,画不下才会画,就是他字字画不下,他会看上一个字,能不能在它之后换行可以的话就换。对于 Y space 来说,white space 本身如果占的空间,这一行超过这一行的空间好好,但是因为画任何东西。所以他不会出发,反而是后面那个字符,这件事情自然解决一件事情是你把行缩太短,你不会有一个空格在一行的开始空格只会出现在行的末尾。 刘晓义(01:21:15): 通过这种方法很拧,正好还实现了一个问题,刚才说那个 N PSP 的问题,他是说就是连续的 N PSD 中间不能换行,是这个。我换下一页,正好说到这件事情全部就是这是两个其他比较有用的东西,有一个东西叫做 unicos text segmentation。这个东西是分词,就是说你的一个渲染的词大概是什么样的地方,他干的事情是?比如说你的 NDST,这是一帮 NDST,它的意思是 NB ST 中间是不能换的。这个地方是可以换的,所以就是它的表现就是和那个什么是一样的,和普通一样的就是如果这里有个东西,他们就会有这么长,他们不会看,然后他们也不会中间断开。但是他可以一起扔到末尾,然后不需要他出来是两个年级。除非如果你想要的是 non zero 的那种空格,就是它需要在 glass data 里在外面画一个点。它只画一个点是渲染不出来的,因为你是白点,你必须要画一个圈,它才能会你只画一个点,然后他就搞定了。然后这个是 unicode text segmentation,还有一个叫 uniform organization forms。 刘晓义(01:22:35): 如果大家做分词的话,就是比如说你你在你在这块,我双击了这上面的字,大家可以看到的是它自动是选中了一个词,这个是 unicode text segmentation。就是刚刚说的你有一些方法去拼字,它可能用不同的方法拼出不同的字,nation 是给出了一个 normal for 就是比如说你拼出来一个 unicode 里面已经用了马的字,然后他会告诉你直接用那个马就好了,不要我们拼。这个是我觉得比较有关,大家可能会用到两个 unicode 的标准,然后还有就是当然刚刚这个 L,所以现在就解决 layout 的问题,我们既知道我们现在有一堆东西,然后只要我们配合 unicode 的这个算法合一个字体就可以知道每个字放在哪。 刘晓义(01:23:19): 有一些延迟有一些遗留的问题,比如申奥哥哥昨天问了我 justification 的问题,就是那个东西叫做标点挤压之前问过中文的标准解压问题,就是你有一行,如果中文的标点正好在行末。但是你又不想说带两个字换下去,你可以把这行让它挤了之后每个字字之间的间隔小1点,但是你可以把这一行给挤下来,那个东西事实上在有一个表的叫 G 一叫 GUST。Specification. 要 GUSD 还是其他,反正是表这一开头的找一找。J. Cf. Jst. division table 是说这一行里面哪些东西怎么挤一挤可以起来就是英文的挤一挤,但是他只是点着自己非常丑。对这里顺便提后面为什么还能是有一个空格在那个地方,哪个力?我感觉这件事情是,就是你看普通这一行做了拉伸。加起来可以认识吗?作为 chinese speaker 那个对的是骑的,它漂亮,但是作为 chinese speaker 你可能觉得这件事情会很丑,作为 english speaker 他们会觉得不对其他非常的丑,后面会。其实这块现在的算法已经比之前好很多了,之前就是这种算法跑出去就是这个效果能看到非常大的不同,现在基本上字体里边就是这个 justification table 去调整的,基本上你能看到的就是基本上能够排满。 刘晓义(01:24:58): 你仔细看的话,其实这个行和行之间的空格其实还是不太一样。这行的空格比这行大。你仔细看的话,其实可以看。我觉得是他话是两边完全对,然后那个部分这个梦我也是有,但是目前还没有做。 刘晓义(01:25:18): 没有做这个是我仔细看一看,我觉得现在算法会做这件事情就是他会做的比较就是这里会限制上下限就是你可以拉一下,可以撑一下,可以压一下,但是。会有一些增速期,你撑到头了,不能再撑了,因为你再撑就会变成这个样子了。对这就比较丑。像它后面就是英文中间一个词,中间我给它拆开,然后加一个连字线,就是 linux 做那种事情,这件事情其实更牛,你可以猜一猜怎么着? 刘晓义(01:25:57): 加连字线这件事情是这样加连字线里边的。有一种叫 source language 叫 SSL BSLF。他的行为是什么?他是不 mandatory available library,但是当你发生大黄的时候,它会渲染出来一个杠,这个我不太清楚这个需不需要跟自己配合,就是我现在没有太理解他的刚刚的里面给的,我感觉他需要有一个。字体里面去配合你画好的时候才把它渲染出来这个功能你需要表示它的字形是什么样子。我现在不太清楚这一部分的字形是在哪,但是这个 implication 是什么?是如果你原来的那个字里面就没有这个 software library,它就不会有自动换行的东西。自动化好多东西必须是你的文本编辑软件往里加进去才会有,就是比如在 chrome 里面,应该你直接现在访问这些东西就不太会换。chrome 里面看这些东西都不太符合。对默认的情况是这样的,就是很美妙,这就是现代 unico。 刘晓义(01:27:16): 好说完了,刚刚那个事情了,我们就可以继续看到一些更有趣的事情了。好科 vicious 我们刚刚已经处理好了,每个字是怎么放放在这个?无论是你在哪渲染,在纸上渲染,在屏幕上渲染方面满了,已经解决了。第二,要解决什么事情就是刚刚说字符要 A 要钻到 W 的下面,或者说两个字要连在一起。 刘晓义(01:27:40): 我首先说 king king 是一开始就有的功能,最开始有一个 table table krn table 干的事情是你可以查一个 glass 对,比如说你查到了 W 和 A,然后你发现左边是 w1边是 a 要钻到下面,它会把它的 side berry 就是刚刚说 H advancement 是 WH 往前光没有跑了那么长。所以它捡回去一些,然后你就钻到下,也是非常妙。这事情有什么不妙的地方,就是 POST CR 之后大家发现了有一些其他的用户,比如说。他希望能够挤压到下面去? 刘晓义(01:28:20): 这个时候你会发现这个东西不是一个横向的东西,首先是个纵向的东西。首先第一,这个东西的渲染是什么?这个东西是单独的一个马尾,它是在后面,但是它的 horizontal advancement。是不是零,然后它的这些坐标是负数,听到了上个表现的话。这是另外一个,他需要干的事情是三个马,他和第三个看到了相关,要把它压低要干这样一件事情。你看这件事情拧巴起来了,首先第一件事情就是它不是两个字符的事,第二件事情是他说不懂,然后还有其他一些事情,比如说你刚讲的那个东西,它可以是。对是这样可以这样的马威如果是同一个马威的话,需要用别的方式去处理,就是他可能他需要因为变得更后面主要那个东风大人都是。冒出来,对,那么这会应该会把它换成两个马版本的,是不是两个马威的版本可以做一个马威的版本,你不通过那个 G 是做不了这个,然后所以就是当然还有我们的。人见人爱的 Islamic. Scripts. 刘晓义(01:29:37): Correct. I'm correct. I'm correct. 就是会有很多这样的问题,大家会发现你首先就需要动弹的东西很多,它的方法是什么?就是变成这个样子的,就是你可以什么各种各样不同的,然后这是一个表叫,这是叫基。leaf position。还有一个叫 jub 的表 GT 的表也是和 G p1起加点,他基本上干的事情是你可以把。你可以把多个。多个 GRAPH ID 给拼成同一个这是一种写 FI 的方法,还有刚刚说的这些。然后。反而扣的是典型的例子。 刘晓义(01:30:36): 是一些 nice feature?比较麻烦的事情就是大家可以想象到比较麻烦的事情就是 F variation 是怎么整的,就是事实上是一个非常拧的事情,就是一开始我们刚刚看的是大家存在那个里面,belief 里面存数据。 刘晓义(01:30:55): 然后你要修怎么修?现在的做法是用1个叫 jr table 的公司就是他基本上干的一件事情是他会 special 一个 range,它会有一个区间,然后你区间上面有一个斜率,有一个和 Y 轴交的点,然后你就画出来一个一次函数。这个一次函数你可以求一个值,你就知道它有那个点在哪。如果你觉得一个一次函数不够,你还可以找好几个一次函数,把它拼成一个 pure line 的东西,然后这样的话,你就可以让每一个点去动态。然后随着它,你调东西叫 variation access,比如你调一下位置,它会根据这个位置去调一下,就是一个有点像多元的依次的一个线性函数一样。不是多元一词,就是多元的一个线性函数,你就可以去修改它。belief 的表就变成了一个 F 音符表变成一个 fallback 是说当你这个操作系统或者你的渲染程序不支持 variation 的时候,我们可以至少可以画出来东西。当你仔细阅读它标准的时候,你会发现一些有一点不妙的东西来念一下这个 open type variation supported 存在 GB 里非常好,存在 CB 好。 刘晓义(01:32:05): 这是什么叫做 version data for outline and in our store receiving the cf fr table 可以存进去 partially using common formats for variation data also using article tables?不太妙 C f2是什么?我刚提到这件事情,我们刚刚提到了,在哪提到了它比较新的一个表格。仔细看不妙了,这是格拉斯的比较,当你再打开这个 TFP 的代码,我们刚刚也看了 club?觉得很还行,能看懂,然后你打开这个 SRC 打开 tables,然后你看到 CF F 是单独一个目录的时候,你会不会觉得这件事情不太妙,你把这个目录再打开它第一个文件叫 ar。 刘晓义(01:32:55): 这事就更不妙了 it turns out 它是一个战士虚拟机,我们又需要写写 interpreter。事实上。现在我们是必须要进行的,是因为它 emit 的所有的 control point 都是通过指定它暂时虚拟机先推进去几个参数,然后你去调用一个指令叫做 K,然后你就生成了一个 K,它就在图上画一个 T,然后它的 variation 是怎么做的?variation 是用特殊的指令。 刘晓义(01:33:26): 很好在这里能不能找到叫做 blend?To screen. 你搜一下就是 blender 的做法就是一个很完整的战士虚拟机上面的任意操作。就是你可以干的事情就是。在二点 OS 能干的事情,就是它在上面直接对站上面的那些参数做了刚刚说的那个 linear population。然后你可以看到这个战士集里还有一些很不妙的一些操作,这个东西叫 call global 的。我们仔细想一想这件事。这是一个非常完整的战士心还是不烂。这边的做法就是,然后你在站上面去改一些参数,然后就是你的,所以这个是可以被 GIT 的。事实上常见的那些文字就是被 G IP 出来。你可以想一想,现在文字渲染基本上都在里面代码上跑一些机器码非常的你不能说它妙吧,你只能说非常的不妙?这个基本上 variation 我们解决了之后,我们现在是终于说完了,我们怎么去把一堆数字存储的字丢给一个字体和一个渲染引擎,把它变成了一堆。几何图形,我现在有了一个向量的图片,我现在可以把相应的图片给渲染出来,下面的问题就是我们怎么做,render。I should render 101. 刘晓义(01:35:02): 还有人都是?我的 slide 搞坏了,没事,我们可以现场修改一下,威赛特 zoom。我说了闪 OK,让我们去找一下。 刘晓义(01:35:40): 不好意思,我刚刚来得早地的同学看,可以看到我在那里赶出来,就他赶出来的进度暴露。By rendering. 就是这样一个代码的一个代码,事实上我们的 vector 图片就是。我们 vector 的图片就是一堆。Pass. 一堆什么环,一个这样的东西?我们要渲染它的就是我们去问这个图片渲染出来的一个上面,每个像素它是不是就是这个像素的位置,是不是在这个帕斯内部,那它内部是什么,就是它有没有落到这个画的这个圈子里面,我的我们画了一个圆,它落圆的里面,那它就是在内部为它内部,我们要画黑,我们把它画白?就解决了非常好,你就可以呼了。没解决,为什么没有解决,看一下这个是这样直接渲染它的结果看不太清楚,放大不太妙,这个字的边缘是? 刘晓义(01:36:47): 丑的有很多的锯齿,不太支持大家在这里是看不到的,就是如果我们在这里去看,现在这个版本的渲染是看不到的,但是我们很容易可以把它造出。我就把它倒上。bios 现场填能开发 future?Contrast. 刘晓义(01:37:13): Ok. 我给他一个超高的 contract filter 可以看到这个字体就非常的难看,如果你可以看这两个区别的话。没有区别吗?那可能是个投影的问题就是哪里的 DPS 不够高,对自动就不需要过去靠近。就只要你离得足够远,你这个问题叫做你们现在坐在下面是我坐在这看着很丑,就是如果你要第一定要很高,自动有自动化,那也不需要关心抗击,对我可以给你们看一下为什么是之前写的那个那件事情是用来做什么,那件事情是用来做这个。是用来做这个效果需要加一个非常高的 contract computer 就是如果你不加 computer 的话,就是这个东西其实是用一个不去替代一个 SDF,但是问题叫做你真的加一个 contrast filter 的话,现丑就非常丑陋,渲染出来。基本不能看,所以我们的 our work is not finished。好102我们首先说一下就是刚刚那个所谓的 content 是怎么做,我们怎么知道一个点是不是在一个 pass 里边?基本上的方法就是 one year numbers 这个数学做数学的同学,我非常熟悉这件事情,你去看一下,这是一个有向的曲线,然后去数一下这个有向曲线绕它几圈就好,绕它零圈。 刘晓义(01:38:41): 意味着什么,意味着绕回去了,它如果超过零圈或者小于零圈,就意味着它被圈进去了。我们一般在向量渲染的时候会认为偶数我们把它画白。然后有数就是认为把它画透明奇数次就是把它画成黑色,所以你们在一拉就是用钢笔去画圈的时候可以看到,如果它转了两圈,那个地方就会变透明。 刘晓义(01:39:07): 具体怎么实现这个算法两个方法,第一个是 beta curve 都是三次,你干的事情是你打一个射线出去,我去求教去交了三次方程,可以直接求交,这是第一个事实证明三次方程。求交它就算能求还是怎么办?现在的做法是什么叫做直接把这个线条给变成 segment,是因为贝塞尔曲线是参数曲线也是一个 T 为参数的曲线,然后你提取零到一,你这样把 T 给均分一下,你把 T 给均分一下它这个去取出来上面一堆点,把它们都连成直线。它就变成了一堆折线,而这个折线只要你选那个 T 的间隔足够小,它就是能够逼近这个曲线,然后你再去用直线去求交这种东西求交出来的唯一的问题就是,当那个 P 在特别靠近这个边缘的时候,原来比如说你是个凸的。然后你把它去做一次那个 segment segment,然后它就变平,然后它就跑出去了。只有在那种情况下才会出错。其他情况下基本上不会出错。所以这是在 CPU 上已经快了。在 GPU 上是尤其快,是因为 GPU 上可以并行做这件事情要非常快。所以你在基本上就比如说写写 vector 就是干。然后你从某种角度上,你可以认为那个 vector 是把它变成小三角形,相当于变成一堆三角形。你把三角形给涂黑就好了。 刘晓义(01:40:26): 然后我们这里提一嘴,然后你观察到一个现象,就是刚刚说每一次我们都需要做一次射线求求交才能够做一堆射线求教,你才能够知道一个点在这个 SVG 里面还是就是某一个 pass 里面还是外面。这个结果就是 sag rain 其实是非常慢的一件事情,贝尔曲线的 rain 是一个相对来说就比较慢的事情,至少在这个情况下。这个小笔记本上刷新就是已经跑不太到60F PS 的,尤其现在还在跑渲染的时候,你没看到,有时候就是卡死,因为就是非常慢。主要的问题是 translation 是没有任何问题的。scale 是有问题。你把它 scale scale on 它需要 repay。但是为什么浏览器的 transition transform 在文字 scale 上是工作的。根据群友有一个高群里的高端的浏览器工程师的说法是。浏览器里面做的方法是直接在 mac 上做 information,就是你直接把渲染出来的字给变大变小,就是你不要做 SVG 的,就是那个 mac 的这个问题就是还是像刚刚的你本来渲染特别小的问题,你变大,那你不就是白做抗拒,做多抗拒就非常糊。 刘晓义(01:41:40): 然后怎么解决,你反正是只有在这个变大和变小的过程中,你才能看到这个很糟糕的情况,你把它折一下就好,什么东西都可以。如果大家去逐帧去截浏览器的字体缩放的时候,应该能看到的,中间会变红,然后事实上群友提到这件事情的时候,我们常说复现一下,确实能看到变糊,尤其是小字变大字的时候,东西会变得非常糊。但是。等它变道了才会。然后所以你通常都看不到。 刘晓义(01:42:13): 然后我们提到刚刚那件事情之后,我们就说怎么解决我们刚刚看到非常丑的那件事情 anti alias 他就是我们回忆一下最开始写的这个特别简单的。来测试渲染算法。然后 pixeling color 是这么算一下,你可以直接干的一件事情是?intersection ratio 最理想的情况是,我们如果知道1个 P 覆盖的这个 pixel 的多少面积,我们就直接这么去做就好了 pass intersection ratio 然后我们直接把 black 一抽该多黑变白 ok 这个东西完美渐变非常好。问题叫做这个东西不太好算,这个东西非常难测,你一个三次曲线和一个正方形的交求交面积。还是挺难做的。现在大家怎么做 some pixel 安排在游戏领域叫做超采样。还是游戏领域的人喜欢起名字起的好,然后基本上做法就是我们一般来说,比如说我们做四点超采样干的事情的时候,你这个正方形的像四梆放四个点,分别在这个。四个位置,给他们渲染一下渲染的结果,什么把他们加权平均,然后这整个像素的颜色非常好。 刘晓义(01:43:29): 这个事情不是最好现代的所有的屏幕就是支持的操作系统和浏览器上面的宣传方法是这样。叫做我们根本不用像素为单元渲染,我们直接用你屏幕上面的二结果,比如说你的 LED,那你就屏幕上面的 LED 你是 LCD,那就是屏幕上面液晶的每一个可控制的像素点。那个像素点是一个颜色,不是一个整个像素直接是这种情况去问他是不是在里面的话就把它开开,如果不在里面就把它关掉,所以这件事情导致了为什么我们能看到这个是 P hype 的一个结果? 刘晓义(01:44:06): windows 的就开始整整出来,这个年如果大家有印象的话,一开始 windows 开的时候需要让你在一堆文字里去点,你看起来最清楚的那个为什么我在视屏幕的对,因为当时没有标准 HDMI 上不传,当时 VGA VGA 上不传你的屏幕上面的像素排列是什么?现在也需要传这个东西,包括像他之类的东西都会传进去,就可以看不到你点,就是他在猜你的屏幕上排列是他整一堆排列,然后就是每一个都是用不同的结果,然后你看你最清楚的写,然后他就把那个屏幕上排列。渐渐猜出来就是非常的好。你看我现在欧莱的四天后可以是各种急急不断的样子,那件事情需要给 operating 知道,如果你想要你的手机或者你的屏幕使用的有一个很好的效果的话,你需要让操作系统里面写驱动。不你你现在也可以用 clear type,然后他就给你100个,然后也可以,但是现在会自动一些,就是现在 HTM 上传这个信息了,但是你既然可以选择我前两天才干了两次,然后变清楚了,我知道。 刘晓义(01:45:18): APPLE V 是那个东西它是本质上是把一个 LCD 通过让光路我刚也一样,所以他四项都会长得非常的奇怪,然后你还会把一个计算机屏幕统进来,然后让他在你的 viewport 里面做。然后他的四项作用变得非常的奇妙,只要你的相同密度足够高,都好解决在你眼睛里的每每个单位角度的地步可能甚至都是不一样的。 刘晓义(01:45:57): 不太好解决,感觉就是不知道苹果的工程师有什么非常牛逼的新技术就能看出来什么能看出来。网虫。他直接把逼的慢会打我。那只能我看是不是结束对我的 size 就结束了,但是可以最后提一件事情就是很久之前提过 king 就是最开始那个 class 里面的 instruct ion 是来干什么?直接打开 VP 我觉得 VP 说的最清楚。辛苦。 刘晓义(01:46:34): 看这个图就非常的明显,这个东西就非常丑,这个东西非常好看,干的什么,king 干的事情是标记出文本中的 stand 覆盖。是个是中文算的特别多,很多特别多,所以这种东西都是 S 他会去指导 some pixel analysis 把这个东西沿 pixel 边界对齐。要不然就会现成这个样子,你反而不吃,然后吓成这个样子,就会是干的事情。所以他需要那个指令,他那个指令干的事情,就是他去挪动一点点你的那个字体的那个 gif 的信息。让它能够对齐到这个像素的边界上,然后现在也会有,就是 ct f2现在能做的事情更多,你可以跑一个战士去,你就随便瞎搞。结果就是 hinting 干的一件事情就是事实上,从某种角度上来说,是因为我们做了才会有,就是才需要干这件事。如果还小的话,其实可以明显看出来上面比下面要红一些,这个就是因为你的数数列和横,你的数和横没有演那个 pixel 的边界对齐的原因。 刘晓义(01:47:49): 好,那其实今天我准备的东西就大概提完了,然后虽然说从某种角度上来说是的广告 for the new website,但是还是希望大家能够学到一些新东西,然后也希望我肯定是在这个过程中学到了一些新东西。有什么问题,海上黑的也是。不支持和那个世界里你出菜的其实没有人管,对,就刚刚那个毛不太理解,就实现这个东西也不管。是不是,其实这个时候 LOW CPI 的东西就应该用这个道理,不要使用小于11P T 或者在屏幕上小于11px 的时候,宋体在 linux 上的渲染明显比。你的思源要好,就这个原因有各种各样的原因吧,这是原因之一。另一个就是你的字体越小,你的 stamp 的宽度需要更宽一些,要不然你看不清了,脸特别细。你本身三都比一个 pixel 要窄了,什么都能看,那种情况下是这样惊悚的存在的目的也是这个显示字体还是事实上 open type 里有一个表是。 刘晓义(01:49:07): 点阵替代就是你可以把小的你就可以用点,其实还有一件事就是从右向左的阅读,对我不懂,主要是因为我没写的我就不懂,这是里面。就是 ux16吧,还是 ux14来着 Uax. direction 就是如果你的所有的字符变成了。 刘晓义(01:49:37): 今天讲了一坨东西就得对 HADV 就是倒过来,从某种角度上来说,我不太清楚那个世界是怎么工作的哈。也正是因为如此是工程奇迹,它能做 RTM 和 HR 的混排。我们发现了一命扣的标准的各种对,就是说明巴别塔还是很难见的你你也许让所有人都说一种语言是好做的,但是你不能让所有人同时说一种语。就不好了,我确实不懂,你可以看这个 ux 也非常的长,从上到下的阅读。 刘晓义(01:50:23): 刚刚不是有吗?同时大架的渲染顺序的话,需要干的一件事情,事实上刚刚说的是 H advancement。你在干的,你在相同的东西有东西叫。你在数字渲染的时候,你可以用另外一块完全对偶的表刚刚说到的有什么 V position,它有一个 position 就是有这么个拧过来的这些表的话,如果你想数数据渲染的话,要解决的是,刚刚有一些问题,比如说你的括号要转一个方向,那时候去做。其他的就是就直接用对队友的这个表情就直接可以做。我这里有一个最大的问题是你上放下了一个你看里边出现了阿拉伯数字。红牌的12345它这个东西都是阿拉伯数字,这件事情怎么办?你如果去看台湾这本书的话,他们会有各种的一定要处理,包括你短一点的东西,它会横着就压缩,比如说什么3.3,它就挤到一个字里面,然后什么电话号码,又什么那种全角数字。咱们要不然现场试一试转90度,然后给大家展示一下伟大的。 刘晓义(01:51:52): CSS 叫什么 text direction 吗?但是吃的我查一下,现在是 vertical。writing mode 很重要,对有一些大家的大家在日本去下那些 amazon 的电子书,aw z3转成一步之后,它的竖排其实用 css writing mode 去实现。这是对的,然后你甚至可以把它改成横排,你直接把三去掉,它会变成横排,就是因为因为我做过去把那个删掉的这件事情。 刘晓义(01:52:34): 我可不懂你现在多,世上就是渲染出来是不是很神奇,其实还有一个问题,如果你在一行那边有。100万个字一行里面有100万个字,对刚刚不是说有算法,那是不是再往后会暴力,他会不会? 刘晓义(01:52:55): 你还记得我们一开始有一个问题吗?叫做浏览器为什么这么慢,这是其中一个回答。然后另外一个回答,其实本质上浏览器为什么那么慢的原因是 layout 就是大家写前端的时候,很多的时候会用一个 trick,就是你在屏幕外的东西就不渲染。 刘晓义(01:53:13): 听起来很美,很蠢的一件事情,为什么浏览器不做了,因为浏览器要干的一件事情,他不知道你的一个元素有多高。它需要把每个元素都渲染出来,这是不是一定要规范制定的对的,现在尝试他们加了两个 CSS 的属性,一个叫做。叫做叫 contain 什么什么东西就是他能干的事情,是你 out of view 就不 render。代价是什么,但是浏览器不知道它有多高,一开始会假设成零,事实上我现在的实现是做了这个优化的就是如果我们回主页的话。刷新你看 scroll bar bar 会逐渐变长。你越滚越长。我现在看不出来,说明现在我把修不是一个踏实的问题,我在这里做了 contain intrinsic hide 我们把它去掉,你看这个就变长了,但是你把它滚到这个 bug 会越不越走。对他不知道下面料有多长,因为你这个画这个 score 的长度的时候,你需要知道还有多长?所以就是他干的事情加一个东西叫 content visibility auto 这样的事情就是它 out of view 就不渲染代价,就是你需要给一个这个就是它的默认的高度,这个默认的高度也不太对,比如说我们把这个东西变窄,然后我们重新渲染这个的话,它就会换。 刘晓义(01:54:41): 放行刚那个80对有一些地方画,这个画行时间还是错的,有些地方画行,然后结果就是你看这个瓣还是会变长,就那么还滚的话,后面他跳跳来跳去的原因就是。浏览器还是很伟大的一件事,能帮你干了很多事情,不要说他蠢。为什么都想去?看看还是卡,就是 layout 是一个很难的事情。HTML 的 layout 本身已经减缓了很多,我们想实现的功能已经没有办法帮我们实现 HTML CS 就是为了它简化这个 layout 的工作量。已经去少做了很多事了,如果我们让他再少做的话,就是很多的时候,我本身的一些我们想要的东西就没有了。你想要的事情,其实就是从某种角度上,它是个很简单一样,随便一写。 刘晓义(01:55:37): 该选片儿是啥样,对茄子还是有的,我们可以随便打开一些,你说这个打开一些网站。神秘的水平状态。我怎么搜不到他的?博客你刚说啥随机代码就可以执行,所以浏览器里面有一些别的工程歧义的东西,比如 v8平哥不是今天刚写了一篇 v8的博客,大家欢迎大家阅读就是刚刚一开始他说出纳提到的。就不来线下的群友,他刚刚写了一篇 v81个 nation 解释器的内部时间上就是 v8是怎么 G IP 的?非常的有趣,就是反正现在浏览器不比操作系统简单,对为什么电子。就是为什么柯达都痛恨电子,人人都在电子实在是太多了,对浏览器帮敏感的事情实在是太多了。包括像 style style 的这种东西,现在事实上我们之前一直不觉得是平静的事情,现在逐渐变得平静。叫做 style resolution 他去看某一个元素去匹配哪些,我现在有很多很拧的东西 media query container。我们可以看的是他问周围的那个 container 有多大,然后还可以干的一些额外的事情,他可以问他的孩子有没有哪些东西,我们现在能写的一件事情是。 刘晓义(01:57:23): 1个元素是不是 has 一个什么东西 hover 你的时候它会可能是变成整个 parent tree 上面,你是不是选不上?从某种角度上来说,这个东西都是线性的,所有的操作就是 o1的,你最多是一个不是 OEON 的最多是一个 ON LOG N 的所有的自浏览器里面,我现在能想到的这些算法基本上都是这样。问题叫做您常数不小,你每秒要跑64,然后笔记本上就不太支持这件事情。不说有一些浏览器还喜欢,不是有一些博客还是要整化,比如说你把这个鼠标放在了后面,就还有一个东西聚集过来,然后你把它放在那里半个小时之后,你的后面就会聚集几万个点。它优化有问题,就我这个写的不是只有在我的电脑上跑不了六60在所有人电脑上都会跑一样的,整体就是都是跑不到60就是一致的,它不会像出现刚刚那个情况也不会越跑越慢。 刘晓义(01:58:33): 反正我回得修这件事情就是事实上讲一些鬼故事就是这块用了很多 SVG 的动画,这个其实 SVG 的动画就是如果大家仔细看的话,这个其实是。一个东西 use 了三次,然后同时用 mask mask 也用了这个 SCD 里面用 problem problem 叫做 safari 上面不支持 SCD 里面的 transform,所以这个 logo 现在 safari 上完全渲染不出来的。 刘晓义(01:58:59): 有点三号2348对的会有哪些 bug 就一个是渲染不出来,另一个是它在返回标题的时候,所有标题都会消失,对的是因为那里面也都是实现。你说在一开始加载的时候没有穿错,就是这个东西得回去改这个东西,为什么是一个很大的问题?你说底下那个东西好解决的人大不了,我说你不做动画。上面这个东西是因为我在里面用了 a,然后它的返回按钮是左上角,所以你现在的情况在 safari 是没有办法返回,你只能用下次的手势去做了。看不见咱他点油,那挺好。它的形状依然在时,它无法渲染。 刘晓义(01:59:42): 然后这块还有一些很好玩的事情就是 mask 掉的东西其实不会触发的,所以因为你把光标换个音乐很巧妙解决了之后,他的东西就全都对了,就是刚刚说的就是这个东西是因为里面有穿一个 bug。 刘晓义(01:59:58): 这是 webkit 的一个 bug,还没有解决,所以说明现在这个做完网页就是都要在此方面上能测过强对,但是这个东西的叫做 can I use?便宜又是眼看我们随便搜一个东西。我塞个门子,卡斯会比 S CG,我刚刚说卡斯会比 SC 我看一下 safari 的总利用率是多少?use 是 relative。还不少。这下不能忽略它反正的。前端的这个东西比较重要,但是现在 chrome 就感觉有些东西不往上游,不是,而且国内的网站你还要考虑一些什么,搜狗高速浏览会使用那个肯定不管的,这个我可以选择我的这个博客的阅读者都有谁用用这个高速浏览这个不要阅读我的博客。下次写作业展示的时候又讲台上还是纯的东西都渲染不出来,那没有什么办法。对的得带自己的电脑。然后之前给我一个写网站写过一分钟后,他们最后问我有用户,那么全是白的,让用户换浏览器。是这样。从某种角度上,微信的那个小程序就是一个很好的事情!从某种角度上来说,没有浏览器,那是它是一个很屎的一个 HTML 的就是它也是网页的一个人就有点像。 刘晓义(02:01:46): 很好的一件事情是什么?是所有人是一样的事,在你的手机上测出来,它能渲染出来,在别人的手机上也能渲出来,虽然它的渲染出来不多,但是你至少是稳定的,这个就是微信很伟大的一个地方。 刘晓义(02:02:02): KT 的很多,对刚刚说到那个 segment 的事情,其实现在并不是完全浏览器里用的完全的就是如果我们开一个中文的话。在这里是双击中文的文字,你可以直接选择的是词,选的是词汇,这个在 unicode segment 里边没管这件事情,所以 unicode segment 只管了,比如说你的是一个。是一个 gift group,就这个方案也是要分中文的分词是额外做的是 ICU 做你的 chrome 需要 link icu data。然后 ICU 里面就是有一个东西,就是我其实是我刚刚搜的这个东西叫 IM T 小的三个 segments,对这个是 javascript 的最新最热的东西,其实也不太最新最热,既然都支持90%多了,那已经可以完全宣布已经有所有人在用。 刘晓义(02:03:00): 这个东西?是一些额外的东西,就是浏览器需要额外支持的,不是在 unicode 里面直接支持,是因为 unicode 没有语音信息,刚刚提到的所有这些东西其实都是。你需要额外去做,对于中国来说,至少是这样。对于其他的如果有明确的分词的语言的话,就是不太会有这个事情,这是为什么在 telegram 上面中文搜索这么差,你们哪位打过 IOI 的同学?赶紧去给杜叔叔投个简历,把 telegram 的中文搜索给修了,就可以离职了。会比你慢很多,因为英文 mostly syntactic 中文还是 mostly semantic 的一件事情。 刘晓义(02:03:53): alternatively 大家应该干的事情是把中文的搜索当成每个字就是一个词,然后一个字。或者是不是就比如说发送消息,我在这中间插入很多奇怪的不可见的 CSCS 就是 zero space white space?超过了几千吧!然后首先 IOM 专家不要那你搜到的都是那些别人把你的话改了一改,然后再演绎了一下子。跟你说的差不多,不是完全一样,你搜索的时候很有可能也玩你非得打,当时走到了太阳。为什么。但是说实话,那最好的搜索方法就是你直接建一个超级透支数字组,然后直接搜所有的字串,只要四川匹配,你就可以给他打字的就是低于。处理人类身高吗?还是你有事,那你可以干一些更拧巴的事情,我们今天讲的是自己渲染,就可以把字渲染出来,然后你做图形的近似就是那个近似匹配?你看一下两个图片有多相似,你知道顺便还把 OCR 给做了多好。多模态,你看这瞬间的多模态的方法是你把文字转成图很妙。anyway 线上的同学们有什么问题一直没有看线上的 Check. 刘晓义(02:05:49): 两个菜。windows 默认级比较,这是比较早的。对我的印象里说,windows 现在是默认就是至少是我不太清楚是不是因为一些古典选项的问题。我不是 windows 专家。现在是他是因。我也不是 linux 的专家,我是 linux 用户。要求不差。If there are anybody in the Youtube chat. 哪个。给你一口支持我在家里试是 ok 的,但是主要的问题就是我现在我再试一次吧,就是咱们去找那个直接去把原先的地方给弄出来,我的感觉是因为 VC 的复制不太好复制。你说支持的是各种各样的之类的东西,就东西。我可以现场试一试。 刘晓义(02:07:18): 把这个东西复制出来。能不能再选一选,能不能多两个人? 刘晓义(02:07:24): Man Woman. ok 就它复制出来换换个肤色,这个东西本身是。他需要在各个平台上都实现他的不需要这个东西,你可以看到的就是刚刚提到这两件事情就是为什么我们东西其实结合了我刚刚说的两个玩意。它的人和肤色的配合是用把它剃成了另一个 G,所以就是你的人的脸的颜色就变了,你的人放在哪个位置?是靠**去变的就是人跑到了左上面是通过不是通过去做,所以这就是一个四个字的。你把它复制出来,终端是咫尺的文字终端支持的 R 点 from a 复制进来了,你打个括号就不行。我觉得是小狼嚎的问题。 刘晓义(02:08:23): 二位真不错!alternatively 可能是 T 电脑复制表这个可以复制。这样的回答问题。起码这下找到 bug 了,就是邻里烤肉,还不是想分这些作品的。首先第一个你可以看到它字宽的匹配是有问题,这个东西也是一个 unicode 的什么是字宽是根据去做的就是 unicode 会做一个宽,但是它和自己的宽不一定是一样的。你刚刚说。哪些价格需要跟哪?要加一些图片,因为他加的图片那是人家自己对他只能加对描述一下这个自行程序,那电电脑上看过一毛,你上吗?你是孩子,我才看到没,还有 google 的苹果的不一样的对,就是长得不一样,我的平台上长得这个样子,你可以看到和我刚刚截的图都不太一样,我这两个甚至都是 windows 但是两个不同版本的 color。比较老版的卡车这个东西。我截的图是传说中的 fluent,把服装的给挡住。中国的电池倒闭了吧,那你看你你还在你看 fitful flood 都会问的。 刘晓义(02:10:00): 这个东西复制出来,对的就是 fluent 我看这种复你点进去 office 还在用这种 UI 吗?office 这个 office 是?你看他 logo 都挺滋润的,我觉得它里面还有双手肯定不会。K是吧 K 的第一个给改成黑的 K 点转转默认是什么转?可以干这种事情。好像 iphone3有关系,为什么坏了他不能改,但严格来说都是可以改的,然后他不能家族来自不同的瑞士是吧? 刘晓义(02:11:01): 非常的 racist 数一数可以再改1012,三四,五,六,七,八,九十十。有点重。你每人一?我对我看一看他的换行有没有犯罪。这套话好像有错。刚才是什么还能直接处理换行是错的,是因为这行算法是对具体说一下就是你仔细看的是。你仔细看的时候是说换行是所有的,它只能是 unicode 在这个位置上做画行,在那个 DWG 上做画行,所以他干的事情是,他说后面有一个地方可以换行。为什么刚才自己渲染出的,虽然这就会导致换行错码?这是另一个问题,就是字体,其实它的 horizontal advancement 也是不知道你想说的这件事情,他后来的方式是先在 gp 之前处理的。我思考一下,这是一个等级吗?为什么这个东西它的反应耗在那么远,这个就是他的那个号的王子说错了,对,就是你可以我的感觉它的实现字体里面实现有点问题,和这个没有耦合,然后把所有东西都顶出来。然后他最后再把他们压在一起,我说再放大一点的时候,她是在那个小孩和肤色之间换的好,是也不是对这个地方是这样的,这个地方是这样。 刘晓义(02:12:57): 小时。那可不得他一家的,我觉得我还不好说,让人比较刺激,你觉得 word 实现非常正确,先看 word 里面是不是 fluent。老师,我的课件。Blank document. 那你放下吧,我可以这样做,好像是对的。这个感觉确实就是不敢。你看这里面福州地貌地对外面就不是福州地貌。对咱们考主要没有问你不能问题。我买了那个打龙片子,阿拉伯我都忘了他刚才是不是直接第一个字符就渲染错了。对它的 G 他的 gpose 没有处理大于两个字符的合并就是也许是个 bug,直接把那个 type 的就是 T 的这个东西就是 type 的。这个就是咱们刚才是图像是。就对这是图像这个东西是对的,就是这个是伟大的来自群友的 type 的 preview 这个东西渲染对的,但是它的渲染方式是。P 它的生产方式是 HDML 是一天不认识,反正它的这个字体是自己单整的,这是对的。但是我下载的这个 PDF 是它一次编译出来的就是错,它这个。你不能说还是气,你觉得他屁股? 罗云千(02:14:58): 能听到吗。 刘晓义(02:14:59): 我还真不知道他是怎么实现,你看这个东西就是错的,它只实现了两个字符的这四个人都没了,那就是换。反正挺坏的一个非常的坏。Ok. 刘晓义(02:15:24): 今天至少尝试一下这伟大的 JS 修改家庭的肤色。是你说,那么大家的性别和辐射。他不能把两个三个家长拼起来,我还在家是真的有事有没有你说的,那你好像说那种直接扣的那种。在那里随便放过,我现在访问这个 encyclopedia 是我感觉他在用我的,然后每次打开的时候都超。但是我记不住这些反应,你你直接这样拍的太复杂。对我可以用他。可以用这种东西,打开它?Programming. 看看他有没有什么?比较少,没有多少感觉。他们没有同样不是很好。侯丁汉点慢,否定汉典不买点吗?这种娃娃菜怎么可以免房费的。这个东西太现代了,以至于后现代了,不要做。这啥时候期是没几年,是不是哪个听听这玩意儿挺久的就是 CWG 出来的时候 CWG 有人头有看看历史。Petrona. 苹果不是好点儿的,整个我前面还是比四年的。对16年就有了。这是04年就有了 Unical Consulting. 在做会用电脑之前就有这件事情,他们的 DI 还是很坚定的,那时候就有羽毛就有了日本人整的。 刘晓义(02:18:13): 那边还有一毛钱吗?对他说的阴蒂。你们不支持?是你们那天一共做的是条日本人长得挺早的,但日本人又不用英。喝杯水。我好喜欢,bl。我们能不能改回 blog 的羽毛?beginning of07年也有。那确实挺高。If I accepted the proposing in 2010. 他们能讲出这些奇妙的用法,真是太厉害了。太简单。爆炸老奶奶?主播不看电,我不应该宣布世界上没有成功的那一切的问题,不是你就活在两个谎言里。一个谎言叫做 PDF 不是纯文本 meanwhile,你被 adobe 完全控制底下都是 postscript?那 PDF 为什么不是纯文本。PDF 为什么是成 PDF,哪里不纯哪里纯文本,哪里不纯文本?刚刚不是说了你多模态,你人是多模态的对你而言,文字和图片没区。把车子都成了。因为我觉得你说的也有道理,就很像刚刚说的文字都应该渲染出来,以为什么方式传输你的屏幕显示器太高了。too bad 这也不对,你又不愿意了,你看你就是用的屏幕太高级了,不愿意接受我们这种穷人的普通。也是个好日子。anyway 我今天要说的地方就这么多了。现在已经白话了好久,我想他们已经讲了很长。我这里边半个小时就找完。 刘晓义(02:20:42): 在线的同学们还有什么 ok 还有一个问题,那 SVG 哪来的,能介绍一下 web 里手动渲染文字的 SAG 的轮子吗?轮子是手写的,就是你 pass 了。其实我把。是不是发的着?还可以直接看源码,然后渲染到 SCD,你就是直接把 pass 给 serialize scd 的那个 pass 就好了,特别好,没有开发,但是刚刚说确实是需要。需要改成 HTM,或者说不认识 TM 就是反正你在开发上画,要不然就是现在问题比较大,比较好的是它其实没有做四级圈,它用的是 PIN T。可以直接用卡画这个 SPG 哪来的 SPG 是刚刚说的那些字体,然后用刚刚说的这一套东西去 layout 加渲染出来。 刘晓义(02:21:44): 现在的情况是每一页会?看一看能不能看到。有的。每次发布编译。你看别带他了。就是整个博客的所有文章就是我当时想了半天,我怎么去做一个没有后端的一个东西,后来想明白了叫做你其实整个博客的所有文章就算加了这么多垃圾,加起来也不到一个兆,然后你直接用什么?然后这里给压一下就变成两就变成50k 了,然后你直接从脑中传下来就好了,每次都全量传输,什么都不,这就是美丽的现代互联网?你看这里面绝大多数其实都是垃圾,真正的文字只有很少。倒是现在的这个做法的好处是,我要是没有后面那些修改,把它给搞坏的话,可以做一件事情,是我们甚至可以把 GS 关掉,它也是工作。还需要什么 M GM G? 刘晓义(02:23:04): Disable Javascript. 我们在很藏有很深的地方。也是工作,现在情况是这样,但是没有渲染,但是我不带这么去看他的工作,我觉得是可以是因为现在没有在前端选任何的东西可以试试。33个23个?开个门再不上车。甚至搜索框能加载出来,搜索是不工作。比卡非常的好!它能不能加载链接之类的链接是不工作的,是因为回不到顶层,来看看这个东西工作,我至少从下面进去是不工作。讲了两遍。熬的还是挺快的。可以工作太高级了,太高级。之前有过一次有过一些想法,就是至少给镜像站整一个这样的东西,就是因为我个人用的很多时候在终端上去整,然后就想加一些东西,然后就不知道在哪,后来过了。不知道有没有群友,有一些意向去给 mirror help 做一个。 刘晓义(02:24:42): anyway 今天已经九点,要不然就这样,我看现场还有什么问题。One pneumatic. 我单篇文章压缩都上不来,那是你写的多,不要去你发不动的方式感觉被骂到。单篇文章压缩上百有图,我觉得文字单独压缩上百比较难,我这边的图是外链,我真想说不开。 刘晓义(02:25:14): 对的压缩上 K 的话字数得百万。我的感觉是中文的伤没有那么高,具体是什么什么病因为钱而不发,别把中国取消了浪费,但是你无论说多过一次压缩吗?你过一次压缩这个东西,你可以认为现代的压缩算法实上已经比较能够接近。信息商的那种?没有微信常数 factor,我建议长。我感觉好像是四,只要你文本的量不够大,压缩算法可以抵出来一个。然后你里的所有东西都是汉物,他可以自己 discover 出来一个一分数的,放在它自己是的。理论计算机。ok 那好,那要不今天就这样线上的各位同学们,感谢大家的聆听,线下同学们,感谢大家的,很感谢大家到了现场来听,然后。祝大家身体健康,周末愉快,三八妇女节愉快!如果有需要庆祝的请。再见。