-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
280 lines (222 loc) · 14.4 KB
/
index.html
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
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Gavin Tang`s blog</title>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/fonts/remixicon.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/animate.min.css">
<link rel="stylesheet" href="https://www.gavintang.me/media/css/tailwind.css">
<link rel="stylesheet" href="https://www.gavintang.me/styles/main.css">
<link rel="alternate" type="application/atom+xml" title="Gavin Tang`s blog - Atom Feed" href="https://www.gavintang.me/atom.xml">
<link rel="apple-touch-icon" sizes="180x180" href="https://user-images.githubusercontent.com/9823338/184072451-92087c54-ad2c-416b-8272-cd0f8f8b49f4.png">
<link rel="icon" type="image/png" sizes="32x32" href="https://user-images.githubusercontent.com/9823338/184072484-b0dfbda7-6d72-4035-992a-bb7f751ad2da.png">
<link rel="icon" type="image/png" sizes="16x16" href="https://user-images.githubusercontent.com/9823338/184072477-a9409e8b-26ea-433e-9bee-08245735e45d.png">
<link rel="manifest" href="/site.webmanifest">
<link rel="mask-icon" href="/images/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="msapplication-TileImage" content="https://user-images.githubusercontent.com/9823338/184072540-94b9e5da-2280-4451-a5ca-32a6f1f7536a.png">
<meta name="msapplication-config" content="/browserconfig.xml">
<meta name="theme-color" content="#ffffff">
<script async src="https://www.googletagmanager.com/gtag/js?id=G-H0P8V3NCDW"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-H0P8V3NCDW');
</script>
<meta name="description" content="Program, algorithm and cool tech" />
</head>
<body>
<div class="antialiased flex flex-col min-h-screen" id="app">
<div class="nav py-3 md:py-8 fixed w-full z-10 bg-gray-50 dark:bg-gray-700 transition-all duration-300" :class="{ 'scroll': scrolled }">
<div class="flex justify-end px-4">
<div class="w-8 h-8 flex justify-center items-center rounded-full md:hidden" @click="showMenu = !showMenu">
<i class="ri-close-line" v-show="showMenu"></i>
<i class="ri-menu-3-line" v-show="!showMenu"></i>
</div>
</div>
<nav class="max-w-4xl w-full mx-auto text-center flex flex-col md:flex-row justify-center md:block" :class="`${ showMenu ? 'block' : 'hidden' }`">
<a href="/" target="" class="py-2 md:py-1 px-4 mx-4 inline-flex transition font-semibold rounded dark:hover:bg-gray-600 hover:bg-gray-200">
Home
</a>
<a href="/archives/" target="" class="py-2 md:py-1 px-4 mx-4 inline-flex transition font-semibold rounded dark:hover:bg-gray-600 hover:bg-gray-200">
Archives
</a>
<a href="/tags/" target="" class="py-2 md:py-1 px-4 mx-4 inline-flex transition font-semibold rounded dark:hover:bg-gray-600 hover:bg-gray-200">
Tags
</a>
<a href="/about/" target="" class="py-2 md:py-1 px-4 mx-4 inline-flex transition font-semibold rounded dark:hover:bg-gray-600 hover:bg-gray-200">
About
</a>
<a href="/books/" target="" class="py-2 md:py-1 px-4 mx-4 inline-flex transition font-semibold rounded dark:hover:bg-gray-600 hover:bg-gray-200">
Books
</a>
<a href="https://www.gavintang.me/atom.xml" target="_blank" class="py-2 md:py-1 px-4 mx-4 inline-flex transition font-semibold rounded dark:hover:bg-gray-600 hover:bg-gray-200">
RSS
</a>
</nav>
</div>
<div class="max-w-4xl w-full mx-auto ">
<header class="flex py-16 md:py-32 mt-12 flex-col md:flex-row px-4 md:px-0 animated fadeIn">
<div class="flex-1 order-2 md:order-1 md:pr-16">
<div class="text-4xl font-bold text-center md:text-left">
Gavin Tang`s blog
</div>
<div class="text-xl text-gray-500 mt-4 text-center md:text-left">
Program, algorithm and cool tech
</div>
</div>
<div class="md:mx-8 flex-shrink-0 self-start rounded-full border-4 border-dotted border-transparent hover:border-yellow-50 p-2 w-32 h-32 order-1 md:order-2 mx-auto s3-dotted">
<img class="rounded-full object-cover" src="https://user-images.githubusercontent.com/9823338/184072462-e220b714-6a8d-4ad8-abef-d14dde0b49c6.png?v=1710787565030" alt="Gavin Tang`s blog" width="100%" height="100%">
</div>
</header>
<div class="shadow-box bg-white dark:bg-gray-600 border-gray-300 rounded-none md:rounded-lg -mx-1 md:mx-0 md:px-0">
<div class="p-8 border-b border-gray-200 dark:border-gray-700 flex relative overflow-hidden flex-col md:flex-row animated fadeIn">
<div class="flex-1 order-2 md:order-1">
<h2 class="text-2xl font-semibold mb-4">
<a href="https://www.gavintang.me/nginx-build/" class="text-gray-700 dark:text-gray-200 border-b-2 border-dotted border-gray-200 dark:border-gray-400 dark:hover:border-gray-200 hover:border-gray-600 transition-all duration-100">
Nginx静态编译
</a>
</h2>
<div class="mb-4 text-xs text-gray-500">10-10-2022</div>
<div class="mb-4 text-gray-500 dark:text-gray-300">
网上已经有很多这方面的资料，本文主要侧重以下几点，
采用Nginx官方最新版本源码构建(不再需要QUIC版本)，以支持HTTP/3；
集成Lua模块，开发高性能Web服务；
集成ngx_pagespeed加速访问；
全静态编译，干净又卫生...
</div>
<a href="https://www.gavintang.me/nginx-build/" class="btn">
Read more
</a>
</div>
</div>
<div class="p-8 border-b border-gray-200 dark:border-gray-700 flex relative overflow-hidden flex-col md:flex-row animated fadeIn">
<div class="flex-1 order-2 md:order-1">
<h2 class="text-2xl font-semibold mb-4">
<a href="https://www.gavintang.me/recursion/" class="text-gray-700 dark:text-gray-200 border-b-2 border-dotted border-gray-200 dark:border-gray-400 dark:hover:border-gray-200 hover:border-gray-600 transition-all duration-100">
递归
</a>
</h2>
<div class="mb-4 text-xs text-gray-500">31-10-2018</div>
<div class="mb-4 text-gray-500 dark:text-gray-300">
<p><strong>递归</strong>（Recursion），是一种解决问题的方法或编程技巧，将问题分解为更小的子问题，直到得到一个足够小的问题可以被简单的解决；通常递归涉及函数的自身调用，递归允许我们编写优雅的解决方案，解决可能很难编程的问题。</p>
</div>
<a href="https://www.gavintang.me/recursion/" class="btn">
Read more
</a>
</div>
</div>
<div class="p-8 border-b border-gray-200 dark:border-gray-700 flex relative overflow-hidden flex-col md:flex-row animated fadeIn">
<div class="flex-1 order-2 md:order-1">
<h2 class="text-2xl font-semibold mb-4">
<a href="https://www.gavintang.me/queue/" class="text-gray-700 dark:text-gray-200 border-b-2 border-dotted border-gray-200 dark:border-gray-400 dark:hover:border-gray-200 hover:border-gray-600 transition-all duration-100">
队列
</a>
</h2>
<div class="mb-4 text-xs text-gray-500">24-10-2018</div>
<div class="mb-4 text-gray-500 dark:text-gray-300">
<p><strong>队列</strong>（Queue）和栈非常相似，它们的底层实现几乎完全相同，只是操作方式不同。可以把队列想象成银行排队取款，先来的先取，后来的人只能站末尾，不允许插队。先进先出，这就是典型的「队列」。最基本的操作也是两个：入队 enqueue()，放一个元素到队列尾部；出队 dequeue()，从队列头部取一个元素。</p>
</div>
<a href="https://www.gavintang.me/queue/" class="btn">
Read more
</a>
</div>
</div>
<div class="p-8 border-b border-gray-200 dark:border-gray-700 flex relative overflow-hidden flex-col md:flex-row animated fadeIn">
<div class="flex-1 order-2 md:order-1">
<h2 class="text-2xl font-semibold mb-4">
<a href="https://www.gavintang.me/stack/" class="text-gray-700 dark:text-gray-200 border-b-2 border-dotted border-gray-200 dark:border-gray-400 dark:hover:border-gray-200 hover:border-gray-600 transition-all duration-100">
栈
</a>
</h2>
<div class="mb-4 text-xs text-gray-500">17-10-2018</div>
<div class="mb-4 text-gray-500 dark:text-gray-300">
<p><strong>栈</strong>（Stack）是计算机中描述的一种操作受限的线性表结构，这种数据结构只允许在一端插入和删除数据，即：先进后出/后进先出，这就是典型的「栈」结构。</p>
<p>当某个数据集合只涉及在一端插入和删除数据，并且满足后进先出、先进后出的特性，这时我们就应该首选「栈」这种数据结构。</p>
</div>
<a href="https://www.gavintang.me/stack/" class="btn">
Read more
</a>
</div>
</div>
<div class="p-8 border-b border-gray-200 dark:border-gray-700 flex relative overflow-hidden flex-col md:flex-row animated fadeIn">
<div class="flex-1 order-2 md:order-1">
<h2 class="text-2xl font-semibold mb-4">
<a href="https://www.gavintang.me/linkedlist/" class="text-gray-700 dark:text-gray-200 border-b-2 border-dotted border-gray-200 dark:border-gray-400 dark:hover:border-gray-200 hover:border-gray-600 transition-all duration-100">
链表
</a>
</h2>
<div class="mb-4 text-xs text-gray-500">12-10-2018</div>
<div class="mb-4 text-gray-500 dark:text-gray-300">
<p><strong>链表</strong>（Linked list）相比数组，是一种稍微复杂一些的数据结构。这两个非常基础、非常常用的数据结构，我们常常会放到一块儿来比较。从底层存储结构来说，数组需要一块连续的内存空间来存储，对内存要求相对较高，比如申请一个200MB大小的数组，当内存剩余的总空间即便大于200MB，但如果不是连续的一块内存，申请也会失败。而链表则相反，它不要求连续的的内存空间，即通过指针将一组零散的内存块串联起来使用，对内存要求较低。</p>
</div>
<a href="https://www.gavintang.me/linkedlist/" class="btn">
Read more
</a>
</div>
</div>
<div class="p-8 border-b border-gray-200 dark:border-gray-700 flex relative overflow-hidden flex-col md:flex-row animated fadeIn">
<div class="flex-1 order-2 md:order-1">
<h2 class="text-2xl font-semibold mb-4">
<a href="https://www.gavintang.me/array/" class="text-gray-700 dark:text-gray-200 border-b-2 border-dotted border-gray-200 dark:border-gray-400 dark:hover:border-gray-200 hover:border-gray-600 transition-all duration-100">
数组
</a>
</h2>
<div class="mb-4 text-xs text-gray-500">10-10-2018</div>
<div class="mb-4 text-gray-500 dark:text-gray-300">
<p><strong>数组</strong>（Array）在逻辑上是一种线性表数据结构，在物理上是顺序存储结构，它用一组「连续的内存空间」存储一组具有「类型相同」的数据；正因为这两个约束使得数组具备随机访问的特性，但同时要想在数组中插入或删除数据，为了保证连续性，就需要做大量的数据搬移工作。</p>
</div>
<a href="https://www.gavintang.me/array/" class="btn">
Read more
</a>
</div>
</div>
<div class="p-8 border-b border-gray-200 dark:border-gray-700 flex relative overflow-hidden flex-col md:flex-row animated fadeIn">
<div class="flex-1 order-2 md:order-1">
<h2 class="text-2xl font-semibold mb-4">
<a href="https://www.gavintang.me/algorithm-complexity/" class="text-gray-700 dark:text-gray-200 border-b-2 border-dotted border-gray-200 dark:border-gray-400 dark:hover:border-gray-200 hover:border-gray-600 transition-all duration-100">
算法复杂度分析
</a>
</h2>
<div class="mb-4 text-xs text-gray-500">05-10-2018</div>
<div class="mb-4 text-gray-500 dark:text-gray-300">
<h3 id="为什么需要复杂度分析">为什么需要复杂度分析？</h3>
<p>通过统计、监控，就能得到算法执行时间和占用的内存大小，但测试结果非常依赖测试环境，测试结果受数据规模与有序度的影响较大；所以需要一个不用具体的测试数据来测试，就可以粗略地估计算法的执行效率的方法，这就是算法复杂度分析。</p>
</div>
<a href="https://www.gavintang.me/algorithm-complexity/" class="btn">
Read more
</a>
</div>
</div>
<div class="p-8 border-b border-gray-200 dark:border-gray-700 flex relative overflow-hidden flex-col md:flex-row animated fadeIn">
<div class="flex-1 order-2 md:order-1">
<h2 class="text-2xl font-semibold mb-4">
<a href="https://www.gavintang.me/data-structure-and-algorithm-Introduction/" class="text-gray-700 dark:text-gray-200 border-b-2 border-dotted border-gray-200 dark:border-gray-400 dark:hover:border-gray-200 hover:border-gray-600 transition-all duration-100">
数据结构与算法介绍
</a>
</h2>
<div class="mb-4 text-xs text-gray-500">29-09-2018</div>
<div class="mb-4 text-gray-500 dark:text-gray-300">
<blockquote>
<p>通过学习 <a href="https://time.geekbang.org/column/intro/126">数据结构与算法之美</a> 专栏、相关书籍以及资料后形成本系列的 <a href="/tag/GU4uZdQGs/">#数据结构与算法</a> 学习笔记。</p>
</blockquote>
<h3 id="为什么要学习数据结构与算法">为什么要学习数据结构与算法？</h3>
<p>建立时间和空间复杂度意识，写出高质量的代码，能够设计基础架构，提升编程技能，训练逻辑思维，积攒人生经验，以此获得工作回报，实现你的价值，完善你的人生。</p>
</div>
<a href="https://www.gavintang.me/data-structure-and-algorithm-Introduction/" class="btn">
Read more
</a>
</div>
</div>
</div>
<footer class="py-12 text-center px-4 md:px-0" v-pre>
©2018-2024 Gavin Tang
</footer>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
<script src="https://www.gavintang.me/media/scripts/main.js"></script>
</body>
</html>