GitHub ｜ Timeline ｜ Blog ｜ Blog-SSG
勤学如春起之苗，不见其增，日有所长；
辍学如磨刀之石，不见其损，日有所亏。
如果觉得还不错，点个star吧 😁
版本库中共有492篇文章，总计92585行，1091056字，3039950字符。
这是一个前端小白的学习历程，如果只学习而不记录点什么那基本就等于白学了。这个版本库的名字EveryDay就是希望激励我能够每天学习，下面的文章就是从2020.02.25开始积累的文章，都是参考众多文章归纳整理学习而写的，文章包括了HTML基础、CSS基础、JavaScript基础与拓展、Browser浏览器相关、Vue使用与分析、React使用与分析、Plugin插件相关、RichText富文本、Patterns设计模式、Linux命令、LeetCode题解等类别，内容都是比较基础的，毕竟我也还是个小。此外基本上每个示例都是本着能够即时运行为目标的，新建一个HTML文件复制之后即可在浏览器运行或者直接可以在console中运行。
如果想按照笔记顺序进行阅读的话可以 查看目录 ，另外如果想更条理地查看的话可以访问 我的博客，博客同时也是本版本库的gh-pages分支，是作为纯静态页面搭建在Git Pages上的，使用jsdelivr以及cloudflare作为缓存缓解国内访问速度问题。后期还在gh-pages-ssg分支上部署了SSG版本的 新版博客，并且借助ChatGPT提供了英文翻译版本，分支是部署在Vercel上来缓解国内访问速度问题。在博客中的内容就相对比较多了，除了学习笔记之外还有一些做项目时的记录以及遇到的坑等。HXDM如果觉得还不错，点个star吧，这个对我真的很重要。
- DOCTYPE (en-us)
- HTML语义化 (en-us)
- Cookie与Session (en-us)
- LocalStorage与SessionStorage (en-us)
- Iframe框架及优缺点 (en-us)
- HTML节点操作 (en-us)
- 手动实现轮播图功能 (en-us)
- Canvas基础 (en-us)
- 前端性能优化方案 (en-us)
- HTML5新特性 (en-us)
- 行内元素和块级元素 (en-us)
- 图片等比例缩放方案 (en-us)
- 实现瀑布流布局 (en-us)
- 实现图片懒加载 (en-us)
- Web Worker (en-us)
- 300ms点击延迟 (en-us)
- 默认行为及阻止 (en-us)
- 可替换元素和非替换元素 (en-us)
- HTML与XHTML区别 (en-us)
- 常见的兼容性问题 (en-us)
- Attribute和Property的区别 (en-us)
- 实现拼图滑动验证码 (en-us)
- 实现加载提示组件 (en-us)
- 实现消息提示组件 (en-us)
- DOM和BOM的区别 (en-us)
- 实现三栏布局 (en-us)
- Shadow DOM的理解 (en-us)
- Service Worker的应用 (en-us)
- 蒙层禁止页面滚动的方案 (en-us)
- SVG与foreignObject元素 (en-us)
- 布局垂直居中 (en-us)
- 伪类与伪元素 (en-us)
- CSS盒子模型 (en-us)
- CSS选择器 (en-us)
- CSS样式优先级 (en-us)
- Flex布局 (en-us)
- Grid布局 (en-us)
- Table布局 (en-us)
- SVG基础 (en-us)
- CSS引入方式 (en-us)
- CSS3新特性 (en-us)
- 响应式布局的实现 (en-us)
- 块级格式化上下文 (en-us)
- Position定位 (en-us)
- Float浮动 (en-us)
- 文本溢出截断省略 (en-us)
- CSS隐藏元素的方法 (en-us)
- 如何避免FOUC (en-us)
- display的值及作用 (en-us)
- CSS常用单位 (en-us)
- 实现毛玻璃效果 (en-us)
- CSS实现图形效果 (en-us)
- 实现文字滚动播放 (en-us)
- CSS实现展开动画 (en-us)
- CSS实现渐隐渐现效果 (en-us)
- 手动实现AJAX (en-us)
- ES6新特性 (en-us)
- 原型与原型链 (en-us)
- JavaScript闭包 (en-us)
- JS变量提升 (en-us)
- 匿名函数与自执行函数 (en-us)
- apply、call、bind (en-us)
- 事件冒泡及阻止 (en-us)
- JS事件流模型 (en-us)
- 函数声明与函数表达式 (en-us)
- JS中this的指向 (en-us)
- new运算符 (en-us)
- Js遍历数组总结 (en-us)
- Promise对象 (en-us)
- async、await (en-us)
- Generator函数 (en-us)
- Js中==与=== (en-us)
- JavaScript选择器 (en-us)
- Json Web Token (en-us)
- Js模块化导入导出 (en-us)
- let与const (en-us)
- 作用域与作用域链 (en-us)
- JavaScript异步机制 (en-us)
- Js数组操作 (en-us)
- Js继承的实现方式 (en-us)
- Function与Object (en-us)
- Js严格模式 (en-us)
- Js箭头函数 (en-us)
- 手动实现apply call bind (en-us)
- Js遍历对象总结 (en-us)
- Js获取数据类型 (en-us)
- 手动实现Promise (en-us)
- Js实现数组排序 (en-us)
- defineProperty (en-us)
- Js实现链表操作 (en-us)
- getter与setter (en-us)
- Js中的堆栈 (en-us)
- 防抖与节流 (en-us)
- Js的GC机制 (en-us)
- 实现浅拷贝与深拷贝 (en-us)
- Map与WeakMap (en-us)
- Set与WeakSet (en-us)
- Object对象 (en-us)
- Js捕获异常的方法 (en-us)
- Js中fetch方法 (en-us)
- XML和JSON的比较 (en-us)
- Js文件异步加载 (en-us)
- 深入理解Js数组 (en-us)
- 模板语法的简单实现 (en-us)
- Thunk函数的使用 (en-us)
- async、await剖析 (en-us)
- null和undefined的区别 (en-us)
- Js创建对象的方式 (en-us)
- Js中RegExp对象 (en-us)
- Js中String对象 (en-us)
- Js中Number对象 (en-us)
- Js中Math对象 (en-us)
- Js中数组空位问题 (en-us)
- Js中Array对象 (en-us)
- Js中Currying的应用 (en-us)
- Js中Date对象 (en-us)
- Js中Symbol对象 (en-us)
- valueOf与toString (en-us)
- Js模块化开发的理解 (en-us)
- 常见的内存泄漏场景 (en-us)
- Js中Proxy对象 (en-us)
- Js中Reflect对象 (en-us)
- Js中的逻辑运算符 (en-us)
- Js将字符串转数字的方式 (en-us)
- 函数式编程的理解 (en-us)
- Js实用小技巧 (en-us)
- 深入理解Js中的this (en-us)
- Js中的位操作符 (en-us)
- 跨域问题 (en-us)
- XSS跨站脚本攻击 (en-us)
- CSRF跨站请求伪造 (en-us)
- SQL注入 (en-us)
- 浏览器渲染与内核 (en-us)
- 浏览器重绘与回流 (en-us)
- HTTP协议概述 (en-us)
- CSS劫持攻击 (en-us)
- HTTPS加密传输过程 (en-us)
- 对称加密与非对称加密 (en-us)
- 分布式SESSION一致性 (en-us)
- TCP三次握手 (en-us)
- TCP与UDP异同 (en-us)
- 浏览器事件 (en-us)
- 浏览器页面呈现过程 (en-us)
- RESTful架构与RPC架构 (en-us)
- HTTP协议发展历程 (en-us)
- 微信小程序实现原理 (en-us)
- Window对象 (en-us)
- OSI七层模型 (en-us)
- 浏览器窗口间通信 (en-us)
- OAUTH开放授权 (en-us)
- SSO单点登录 (en-us)
- DNS解析过程 (en-us)
- 强缓存与协商缓存 (en-us)
- GET和POST的区别 (en-us)
- CDN缓存的理解 (en-us)
- domReady的理解 (en-us)
- Document对象 (en-us)
- Location对象 (en-us)
- SSRF服务器端请求伪造 (en-us)
- 浏览器本地存储方案 (en-us)
- Node对象 (en-us)
- History对象 (en-us)
- Navigator对象 (en-us)
- Element对象 (en-us)
- HTMLElement对象 (en-us)
- Event对象 (en-us)
- IntersectionObserver对象 (en-us)
- MutationObserver对象 (en-us)
- 基于fetch的SSE方案 (en-us)
- Vue学习笔记 (en-us)
- Vue-Cli4笔记 (en-us)
- Vue生命周期 (en-us)
- Vue中key的作用 (en-us)
- Vue数据双向绑定 (en-us)
- data为何以函数形式返回 (en-us)
- Vue中$nextTick的理解 (en-us)
- MVVM模式的理解 (en-us)
- v-if与v-show的区别 (en-us)
- Vue中$refs的理解 (en-us)
- Vue中虚拟DOM的理解 (en-us)
- Vue中diff算法的理解 (en-us)
- $router和$route的区别 (en-us)
- 对keep-alive组件的理解 (en-us)
- SPA单页应用的优缺点 (en-us)
- Vue事件绑定原理 (en-us)
- Vue中数组变动监听 (en-us)
- Vue父子组件生命周期 (en-us)
- Vue中computed分析 (en-us)
- Vue路由Hash模式分析 (en-us)
- Vue路由History模式分析 (en-us)
- v-model数据绑定分析 (en-us)
- Vue路由懒加载 (en-us)
- VueRouter导航守卫 (en-us)
- 服务端渲染SSR的理解 (en-us)
- Vue常用性能优化 (en-us)
- Vuex和普通全局对象 (en-us)
- Vuex中的核心方法 (en-us)
- Vue中组件间通信的方式 (en-us)
- Vue3.0新特性 (en-us)
- Vue为何采用异步渲染 (en-us)
- Vue中的三种Watcher (en-us)
- v-html可能导致的问题 (en-us)
- 初探webpack之搭建Vue开发环境 (en-us)
- Vue首屏性能优化组件 (en-us)
- React生命周期 (en-us)
- React虚拟DOM的理解 (en-us)
- React中JSX的理解 (en-us)
- React组件的state和props (en-us)
- 有状态和无状态组件 (en-us)
- 受控组件和非受控组件 (en-us)
- React中的纯组件 (en-us)
- React中的高阶组件 (en-us)
- React中refs的理解 (en-us)
- React中的合成事件 (en-us)
- ReactRouter的实现 (en-us)
- React中组件间通信的方式 (en-us)
- React组件复用的方式 (en-us)
- React中diff算法的理解 (en-us)
- Hooks中的useState (en-us)
- useEffect与useLayoutEffect (en-us)
- useMemo与useCallback (en-us)
- setState同步异步场景 (en-us)
- 手写useState与useEffect (en-us)
- Mobx与Redux的异同 (en-us)
- Context与Reducer (en-us)
- Hooks与普通函数的区别 (en-us)
- Hooks与事件绑定 (en-us)
- React闭包陷阱 (en-us)
- ReactPortals传送门 (en-us)
- 基于React的SSG渲染方案 (en-us)
- Git常用命令 (en-us)
- Git与SVN对比 (en-us)
- Nginx常用配置 (en-us)
- Rollup的基本使用 (en-us)
- Jest中Mock网络请求 (en-us)
- TS内置类型与拓展 (en-us)
- 竞态问题与RxJs (en-us)
- 基于NoCode构建简历编辑器 (en-us)
- 基于drawio构建流程图编辑器 (en-us)
- 初探webpack之编写plugin (en-us)
- 初探webpack之搭建Vue开发环境 (en-us)
- 初探webpack之编写loader (en-us)
- 初探webpack之单应用多端构建 (en-us)
- 初探webpack之解析器resolver (en-us)
- 从零实现的Chrome扩展 (en-us)
- 从零实现的浏览器Web脚本 (en-us)
- 基于Chrome扩展的浏览器事件 (en-us)
- 从脚本管理器的角度审视Chrome扩展 (en-us)
- 基于WebRTC的局域网文件传输 (en-us)
- 基于ServiceWorker的文件传输方案 (en-us)
- 基于Canvas构建简历编辑器 (en-us)
- Canvas编辑器之数据结构设计 (en-us)
- 初探富文本之富文本概述 (en-us)
- 初探富文本之编辑器引擎 (en-us)
- 初探富文本之OT协同算法 (en-us)
- 初探富文本之OT协同实例 (en-us)
- 初探富文本之CRDT协同算法 (en-us)
- 初探富文本之CRDT协同实例 (en-us)
- 初探富文本之React实时预览 (en-us)
- 初探富文本之文档diff算法 (en-us)
- 初探富文本之在线文档交付 (en-us)
- 初探富文本之划词评论能力 (en-us)
- 初探富文本之文档虚拟滚动 (en-us)
- 初探富文本之搜索替换算法 (en-us)
- 基于slate构建文档编辑器 (en-us)
- WrapNode数据结构与操作变换 (en-us)
- Node节点与Path路径映射 (en-us)
- 简单工厂模式 (en-us)
- 工厂方法模式 (en-us)
- 抽象工厂模式 (en-us)
- 建造者模式 (en-us)
- 原型模式 (en-us)
- 单例模式 (en-us)
- 外观模式 (en-us)
- 适配器模式 (en-us)
- 代理模式 (en-us)
- 装饰器模式 (en-us)
- 桥接模式 (en-us)
- 组合模式 (en-us)
- 享元模式 (en-us)
- 模板方法模式 (en-us)
- 观察者模式 (en-us)
- 状态模式 (en-us)
- 策略模式 (en-us)
- 责任链模式 (en-us)
- 命令模式 (en-us)
- 访问者模式 (en-us)
- 中介者模式 (en-us)
- 备忘录模式 (en-us)
- 迭代器模式 (en-us)
- 解释器模式 (en-us)
- 链模式 (en-us)
- 委托模式 (en-us)
- 数据访问对象模式 (en-us)
- 防抖节流模式 (en-us)
- 简单模板模式 (en-us)
- 惰性模式 (en-us)
- 参与者模式 (en-us)
- 等待者模式 (en-us)
- 同步模块模式 (en-us)
- 异步模块模式 (en-us)
- Widget模式 (en-us)
- MVC模式 (en-us)
- MVP模式 (en-us)
- MVVM模式 (en-us)
- cat-输出文件内容 (en-us)
- chmod-更改文件权限 (en-us)
- chown-更改文件所有者 (en-us)
- cmp-文件差异状态 (en-us)
- diff-对比文件差异 (en-us)
- diffstat-文件差异计量 (en-us)
- file-探测文件类型 (en-us)
- find-查找文件 (en-us)
- cut-截取文件内容 (en-us)
- ln-创建文件链接 (en-us)
- less-分页输出文件内容 (en-us)
- locate-快速查找文件 (en-us)
- lsattr-显示文件属性 (en-us)
- chattr-更改文件属性 (en-us)
- mc-文件管理器 (en-us)
- mktemp-创建临时文件 (en-us)
- more-分页输出文件内容 (en-us)
- mv-移动文件 (en-us)
- od-读取文件内容 (en-us)
- paste-合并文件内容 (en-us)
- patch-修补生成文件 (en-us)
- rcp-远程文件拷贝 (en-us)
- rm-删除文件 (en-us)
- split-分割文件 (en-us)
- tee-文件内容分流 (en-us)
- tmpwatch-删除未访问文件 (en-us)
- touch-创建新文件 (en-us)
- umask-设置文件权限掩码 (en-us)
- which-输出命令路径 (en-us)
- cp-复制文件 (en-us)
- whereis-查找二进制文件 (en-us)
- scp-安全拷贝文件 (en-us)
- awk-文本处理工具 (en-us)
- read-读取用户输入 (en-us)
- updatedb-更新文件数据库 (en-us)
- col-过滤控制字符 (en-us)
- colrm-删除文件内容列 (en-us)
- comm-对比文件内容 (en-us)
- csplit-分割文件 (en-us)
- ed-文本编辑器 (en-us)
- egrep-正则模式搜索 (en-us)
- ex-文本编辑器 (en-us)
- fgrep-固定字符串搜索 (en-us)
- fmt-格式化输出内容 (en-us)
- fold-折叠文件内容 (en-us)
- grep-模式搜索匹配 (en-us)
- aspell-拼写检查 (en-us)
- join-合并文件内容 (en-us)
- look-查找字典单词 (en-us)
- pico-文本编辑程序 (en-us)
- sed-脚本处理文件 (en-us)
- sort-排序文件内容 (en-us)
- tr-转换文件内容 (en-us)
- expr-表达式计算 (en-us)
- ps-进程状态管理 (en-us)
- netstat-网络状态管理 (en-us)
- ifconfig-网络接口管理 (en-us)
- traceroute-网络路由跟踪 (en-us)
- route-网络路由管理 (en-us)
- kill-终止进程 (en-us)
- systemctl-系统服务管理 (en-us)
- journalctl-系统日志管理 (en-us)
- ip-网络接口管理 (en-us)
- curl-网络数据传输 (en-us)
- top-系统资源监控 (en-us)
- 简单安全防护 (en-us)
- OD反汇编EXE添加一个启动时的消息框 (en-us)
- IDA反汇编EXE添加一个启动时的消息框 (en-us)
- XSS跨站脚本攻击 (en-us)
- CSRF跨站请求伪造 (en-us)
- SQL注入 (en-us)
- CSS劫持攻击 (en-us)
- ThinkPHP5.0漏洞测试 (en-us)
- SSRF服务器端请求伪造 (en-us)
- 记ByteCTF中的Node题 (en-us)
- VScode配置CMD本地运行环境(2.0) (en-us)
- Recover刷机简介 (en-us)
- Ubuntu16.04安装QQ机器人 (en-us)
- 将SublimeText加入右键菜单 (en-us)
- 手机抓包HTTPS (en-us)
- 文本选中复制 (en-us)
- 发布Npm包到GitHub Packages (en-us)
- 斐讯K3C改散热 (en-us)
- 解决ufw下pptp客户端连接问题 (en-us)
- 建立DNS隧道绕过校园网认证 (en-us)
- 全排列 (en-us)
- 括号生成 (en-us)
- 二进制求和 (en-us)
- 顶端迭代器 (en-us)
- 矩阵置零 (en-us)
- 栈排序 (en-us)
- 长度最小的子数组 (en-us)
- 字母移位 (en-us)
- 跳水板 (en-us)
- 路径总和 (en-us)
- 两个数组的交集II (en-us)
- 全排列II (en-us)
- 插入、删除和获取元素 (en-us)
- 最长公共前缀 (en-us)
- 除数博弈 (en-us)
- 环形数组循环 (en-us)
- 字符串相加 (en-us)
- 有效的括号字符串 (en-us)
- 一次编辑 (en-us)
- 被围绕的区域 (en-us)
- 数组中的第K个最大元素 (en-us)
- 提莫攻击 (en-us)
- 叶子相似的树 (en-us)
- 二叉树的最小深度 (en-us)
- 平衡二叉树 (en-us)
- 电话号码的字母组合 (en-us)
- 使括号有效的最少添加 (en-us)
- 二叉树的所有路径 (en-us)
- 二叉树的层次遍历 II (en-us)
- 组合 (en-us)
- 翻转二叉树 (en-us)
- 子集 (en-us)
- 二叉搜索树中的众数 (en-us)
- 宝石与石头 (en-us)
- 反转字符串 (en-us)
- 两两交换链表中的节点 (en-us)
- 长按键入 (en-us)
- 独一无二的出现次数 (en-us)
- 两个数组的交集 (en-us)
- 子集II (en-us)
- 最接近原点的K个点 (en-us)
- 按奇偶排序数组II (en-us)
- 根据身高重建队列 (en-us)
- 供暖器 (en-us)
- 上升下降字符串 (en-us)
- 保持城市天际线 (en-us)
- 不同路径 (en-us)
- Dota2参议院 (en-us)
- 单调递增的数字 (en-us)
- 买卖股票的最佳时机含手续费 (en-us)
- 字符串中的第一个唯一字符 (en-us)
- 最后一块石头的重量 (en-us)
- 种花问题 (en-us)
- 滑动窗口最大值 (en-us)
- 汇总区间 (en-us)
- 替换后的最长重复字符 (en-us)
- 百度实习生前端面试 (en-us)
- 腾讯暑期日常实习前端面试 (en-us)
- 美团暑期日常实习前端面试 (en-us)
- 字节跳动暑期日常实习前端面试 (en-us)
- 记2021年实习春招历程 (en-us)
- 字节跳动暑期实习前端面试 (en-us)
- 美团暑期实习前端面试 (en-us)
- 蚂蚁暑期实习前端面试 (en-us)
- 记2022年实习春招历程 (en-us)
- 百度秋招提前批前端面试 (en-us)
- 大疆秋招提前批前端面试 (en-us)
- 360秋招正式批前端面试 (en-us)
- 联想秋招正式批前端面试 (en-us)
- 京东秋招正式批前端面试 (en-us)
- 顺丰秋招正式批前端面试 (en-us)
- 拼多多秋招正式批前端面试 (en-us)
- 携程秋招正式批前端面试 (en-us)
- 腾讯秋招正式批前端面试 (en-us)
- 记2022年秋招历程 (en-us)