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