-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.xml
126 lines (108 loc) · 12.5 KB
/
index.xml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>Laam Pui's Blog</title>
<link>https://laampui.github.io/</link>
<description>Recent content on Laam Pui's Blog</description>
<generator>Hugo -- gohugo.io</generator>
<language>en-us</language>
<copyright>© 2017 - 2020</copyright>
<lastBuildDate>Sun, 26 Jun 2022 00:00:00 +0000</lastBuildDate><atom:link href="https://laampui.github.io/index.xml" rel="self" type="application/rss+xml" />
<item>
<title>Git mergeStyle</title>
<link>https://laampui.github.io/posts/2022-06-26-git-mergestyle/</link>
<pubDate>Sun, 26 Jun 2022 00:00:00 +0000</pubDate>
<guid>https://laampui.github.io/posts/2022-06-26-git-mergestyle/</guid>
<description>Git 的 mergeStyle 一共有 3 个选项，分别是 merge（默认）, diff3, zdiff3
可以通过如下命令设置： 1 git config --global merge.conflictStyle zdiff3 也可以手动编辑 ~/.gitconfig 文件添加以下两行
1 2 [merge] conflictStyle = zdiff3 merge 1 2 3 4 5 &lt;&lt;&lt;&lt;&lt;&lt;&lt; HEAD console.log(123) ======= console.log(456) &gt;&gt;&gt;&gt;&gt;&gt;&gt; feature-branch 两个版本互相比较，是需要保留 console.log(123) 还是 console.log(456)
diff3 1 2 3 4 5 6 7 8 9 &lt;&lt;&lt;&lt;&lt;&lt;&lt; HEAD alert(123) console.log(123) ||||||| console.log() ======= alert(123) console.log(456) &gt;&gt;&gt;&gt;&gt;&gt;&gt; feature-branch 两个版本之间多了一个 BASE 版本(竖线跟横线之间)，就是两个版本的共同祖先。
zdiff3 (git 2.35+) 1 2 3 4 5 6 7 &lt;&lt;&lt;&lt;&lt;&lt;&lt; HEAD console.</description>
</item>
<item>
<title>面经</title>
<link>https://laampui.github.io/posts/2020-06-10-%E9%9D%A2%E7%BB%8F/</link>
<pubDate>Wed, 10 Jun 2020 00:00:00 +0000</pubDate>
<guid>https://laampui.github.io/posts/2020-06-10-%E9%9D%A2%E7%BB%8F/</guid>
<description> 最近在面试，记录一些遇到的面试题
浏览器缓存有哪些，及其区别，缓存机制 HTTP 头部字段介绍，TCP 为什么比 UDP 靠谱？数据包是如何传输的？ vue 每个生命周期做了什么 babel 原理 正则实现千分位 闭包，为什么用闭包？如何解决内存泄漏 CSS 选择器优先级 性能优化(代码压缩原理, TreeShaking 原理) 箭头函数与普通函数区别 求输出 1 2 3 4 5 6 7 8 const obj = { 0: 1, 1: 2, length: 2, push: Array.prototype.push } obj.push(3) console.log(obj) </description>
</item>
<item>
<title>记录踩的一个有关中文输入法的坑</title>
<link>https://laampui.github.io/posts/2019-11-28-%E8%B8%A9%E5%9D%91%E4%B8%AD%E6%96%87%E8%BE%93%E5%85%A5%E6%B3%95/</link>
<pubDate>Thu, 28 Nov 2019 00:00:00 +0000</pubDate>
<guid>https://laampui.github.io/posts/2019-11-28-%E8%B8%A9%E5%9D%91%E4%B8%AD%E6%96%87%E8%BE%93%E5%85%A5%E6%B3%95/</guid>
<description>最近踩了一个坑，是关于中文输入法的，想记录一下。
TL;DR
怪异行为：在手机端，调用中文输入法的数字键盘，输入数字时，所返回的 keyCode 为 229。
产生原因：
If an Input Method Editor is processing key input and the event is keydown, return 229.
解决方法： 因为 ASCII 是 unicode 的子集，所以可以巧妙利用 charCodeAt 方法得到正确的 keyCode 值
1 &lt;input id=&#34;foo&#34; type=&#34;text&#34; maxlength=&#34;6&#34; /&gt; |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 $(&#39;#foo&#39;).on(&#39;keyup&#39;, function (e) { // 输入其他字符，直接清空 if (this.value &amp;&amp; !/^\\d$/.test(this.value[this.value.length - 1]) &amp;&amp;) { this.value = this.</description>
</item>
<item>
<title>记录一次使用 sherlock.py 的过程</title>
<link>https://laampui.github.io/posts/%E8%AE%B0%E5%BD%95%E4%B8%80%E6%AC%A1%E4%BD%BF%E7%94%A8-sherlock.py-%E7%9A%84%E8%BF%87%E7%A8%8B/</link>
<pubDate>Mon, 12 Aug 2019 11:17:06 +0800</pubDate>
<guid>https://laampui.github.io/posts/%E8%AE%B0%E5%BD%95%E4%B8%80%E6%AC%A1%E4%BD%BF%E7%94%A8-sherlock.py-%E7%9A%84%E8%BF%87%E7%A8%8B/</guid>
<description>sherlock.py 是一款获取各大社交主页链接的工具，对社会工程有一定的帮助，运行这个工具需要 Python 3.6+
安装方法 参考仓库首页的指引
1 2 3 4 5 6 7 8 9 10 11 12 13 14 # 克隆到本地 $ git clone https://github.com/sherlock-project/sherlock.git # 进入目录 $ cd sherlock # 新建一个虚拟环境 virtualenv venv # 使用虚拟环境 $ source venv/bin/activate # 安装依赖 $ pip install -r requirements.txt 使用 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 # 部分网址需要使用代理访问 $ python sherlock.</description>
</item>
<item>
<title>Who is this</title>
<link>https://laampui.github.io/about/</link>
<pubDate>Tue, 18 Jun 2019 11:15:31 +0800</pubDate>
<guid>https://laampui.github.io/about/</guid>
<description>关于我 日常使用 emacs
在以下地方找到我 Twitter, Telegram</description>
</item>
<item>
<title>学习 srcset 属性</title>
<link>https://laampui.github.io/posts/2018-04-10-%E5%AD%A6%E4%B9%A0srcset%E5%B1%9E%E6%80%A7/</link>
<pubDate>Tue, 10 Apr 2018 00:00:00 +0000</pubDate>
<guid>https://laampui.github.io/posts/2018-04-10-%E5%AD%A6%E4%B9%A0srcset%E5%B1%9E%E6%80%A7/</guid>
<description>要理解 srcset 属性，首先要了解 devicePixelRatio，即屏幕像素比，不同的屏幕设备有不同的值，可以通过 window.devicePixelRatio 查看
在处理响应式网页时，有时为了在不同的屏幕设备上，同一副图片能够合适地呈现，这时可以考虑使用 srcset 属性。
srcset 属性可以让浏览器有所选择地下载适合的图片。
情景1：根据 devicePixelRatio 大小，让浏览器选择合适的图片
这种用法仅限于 img 标签宽度已知 1 2 3 4 &lt;img src=&#34;/uploads/100-marie-lloyd.jpg&#34; srcset=&#34;/uploads/150-marie-lloyd.jpg 1.5x, /uploads/200-marie-lloyd.jpg 2x&#34; alt=&#34;A singer on the stage&#34; width=&#34;100&#34; height=&#34;150&#34;&gt; 上面代码一共设置有 3 幅可选图片，当屏幕像素比为 1.5 时，150-marie-lloyd.jpg 这幅图片会被下载使用；当屏幕像素比为 2 时，200-marie-lloyd.jpg 这幅图片会被下载使用；当屏幕像素比既不是 1.5 也不是 2 时，又或者浏览器不识别 srcset 属性时，100-marie-lloyd.jpg 这幅图片会被下载使用。屏幕像素密度越大，使用分辨率越大的图片。
情景2：根据 Viewport 大小，让浏览器选择适合的图片 1 2 3 4 5 6 7 8 &lt;img sizes=&#34;(max-width: 30em) 100vw, (max-width: 50em) 50vw, calc(33vw - 100px)&#34; srcset=&#34;swing-200.</description>
</item>
<item>
<title>[译] 使用 CSS 的 font-size-adjust 属性改善网页排版</title>
<link>https://laampui.github.io/posts/2017-09-12-%E4%BD%BF%E7%94%A8css%E7%9A%84font-size-adjust%E5%B1%9E%E6%80%A7%E6%94%B9%E5%96%84%E7%BD%91%E9%A1%B5%E6%8E%92%E7%89%88/</link>
<pubDate>Wed, 13 Sep 2017 10:30:45 +0000</pubDate>
<guid>https://laampui.github.io/posts/2017-09-12-%E4%BD%BF%E7%94%A8css%E7%9A%84font-size-adjust%E5%B1%9E%E6%80%A7%E6%94%B9%E5%96%84%E7%BD%91%E9%A1%B5%E6%8E%92%E7%89%88/</guid>
<description>这是上周在掘金领的一篇翻译，是关于 CSS 的文章，我将网页放大了 5 倍都没看出什么区别来。
原文地址：Improve Web Typography with CSS Font Size Adjust 原文作者：Panayotis Matsinopoulos 译文出自：掘金翻译计划 本文永久链接：https://github.com/xitu/gold-miner/blob/master/TODO/improve-web-typography-css-font-size-adjust.md 译者：lampui 校对者：sun、Yuuoniy CSS 中的 font-size-adjust 属性允许开发者基于小写字母的高度指定 font-size ，这可以有效地提高网页文字的可读性。
在这篇文章中，你不仅能了解到 font-size-adjust 属性的重要性，并且还能学会如何在你的项目中使用它。
font-size-adjust 的重要性 你访问的网站大多都是由文本组成的，由于书面文字是网站的重要组成部分，因此就很值得把注意力放到你用来显示信息的字体上面。选对正确的字体能带给用户愉快的阅读体验，然而，使用不恰当的字体则会使网站变得难以阅读。当你决定将要使用什么字体后，一般你就会再给这个字体选择一个合适的大小。
font-size 属性会设置网页中所有 font-family 下你想使用的字体的大小，然而在大多数情况下，浏览器一般都是使用 font-family 下声明的第一种字体。只有当第一种字体因为某些原因不可用时，浏览器才会使用候选字体继续渲染页面。
举个例子，看下面的代码：
1 2 3 body { font-family: &#39;Lato&#39;, Verdana, sans-serif; } 如果你的浏览器从 Google Fonts 下载的 ‘Lato’ 字体不可用时，在这种情况下，Verdana 字体就会被使用。但是，脑海里 font-size 的值好像是针对 ‘Lato’ 字体设定的，而不是 Verdana。
什么是字体的纵横比？ 字体的外观尺寸及其可读性可能会因为 font-size 的值而产生很大的变化，特别像是对拉丁文这种文字会导致其在大小写之间差别巨大。在这种情况下，小写字母与对应的大写字母的高度比例是决定一种字体易读性的重要因素，这个比值通常被叫做一种字体的纵横比。
正如我之前说的，一旦你设置了 font-size 的值，这个值将会对所有的字体起作用。如果候选字体的纵横比跟首选字体的纵横比相差太大，这可能影响候选字体的易读性。
font-size-adjust 属性在这种情形下则扮演着一个尤为重要的角色，因为它允许你设置所有字体的 x 轴高度 为统一大小，以便提高文字的易读性。</description>
</item>
<item>
<title>利用 xrandr 修改 Linux 屏幕分辨率</title>
<link>https://laampui.github.io/posts/xrandr/</link>
<pubDate>Sun, 03 Sep 2017 11:46:00 +0000</pubDate>
<guid>https://laampui.github.io/posts/xrandr/</guid>
<description> 不像 Windows 的远程桌面连接，可以在外观选项卡自动调节屏幕分辨率，Linux 中要做点工作，在使用大屏幕计算机远程自己的小屏幕计算机时，显得较为有用，让它全屏显示。 每一行都是命令，即可以打开终端逐个字母地敲，但……因为效（tōu）率（lǎn），复制粘贴到~/.profile文件中，每次开机让系统自动加载。。。
1 2 3 4 5 6 7 8 #set high resulotion cvt 1920 1080 xrandr --newmode &#34;1920x1080&#34; 173.00 1920 2048 2248 2576 1080 1083 1088 1120 -hsync +vsync xrandr --addmode eDP-1 &#34;1920x1080&#34; cvt 1440 900 xrandr --newmode &#34;1440x900&#34; 106.50 1440 1528 1672 1904 900 903 909 934 -hsync +vsync xrandr --addmode eDP-1 &#34;1440x900&#34; # 使用 xandr -s 1920x1080 </description>
</item>
<item>
<title>刷LeetCode No.136</title>
<link>https://laampui.github.io/posts/leetcode136/</link>
<pubDate>Sun, 30 Jul 2017 10:16:51 +0800</pubDate>
<guid>https://laampui.github.io/posts/leetcode136/</guid>
<description>今天刷了两道 LeetCode，两题难度都是 Easy 级别，不出意外地选择了用 JavaScript 去做，其中 No.136 Single Number 这题参考了讨论区的答案，只有一行代码，被惊艳到了，想研究一下。 1 2 3 var singleNumber = function(nums) { return nums.reduce((a, b) =&gt; a^b); } 首先看题目的描述
Given an array of integers, every element appears twice except for one. Find that single one.
Note: Your algorithm should have a linear runtime complexity. Could you implement it without using extra memory?
题目中文大意是说：给出一个整型数组，除了 1 个元素只出现 1 次，其他元素都出现 2 次，找出只出现 1 次的这个元素。 我当时想得很简单，分别对每个元素从前和从后开始找它的索引，那么对于出现 2 次的元素，该元素会有两个不同的索引，对于只出现 1 次的元素，该元素只有一个索引。见代码实现： 1 2 3 4 5 6 7 8 9 var singleNumber = function(nums) { var result; nums.</description>
</item>
</channel>
</rss>