暂时未有相关云产品技术能力~
擅长 前端/Rust/AI
你应该知晓的Rust Web 框架(二)
你应该知晓的Rust Web 框架
浏览器之性能指标_FCP(二)
Rust 编译为 WebAssembly 在前端项目中使用(二)
Tailwind CSS那些事儿
浏览器之性能指标-FID(一)
计算机是进行数据处理的设备,而程序表示的就是处理顺序和数据结构。由于处理对象(数据)是存储在内存和磁盘上的,因此我们今天来聊聊内存和磁盘。
何为指针 推荐阅读指数 ⭐️⭐️⭐️⭐️⭐️ 使用 Box<T> 指向堆上的数据 推荐阅读指数 ⭐️⭐️⭐️⭐️ 使用 Drop Trait 运行清理代码 推荐阅读指数 ⭐️⭐️⭐️⭐️ Rc<T> 引用计数智能指针 推荐阅读指数 ⭐️⭐️⭐️⭐️ RefCell<T> 和内部可变性模式 推荐阅读指数 ⭐️⭐️⭐️⭐️
vite 是个啥? 推荐阅读指数 ⭐️⭐️⭐️ vite 打包阶段 推荐阅读指数 ⭐️⭐️⭐️⭐️⭐️ 打包阶段的插件执行顺序 推荐阅读指数 ⭐️⭐️⭐️⭐️⭐️ Vite+React的项目打包优化(简单版) 推荐阅读指数 ⭐️⭐️⭐️⭐️
WebAssembly 是个啥? 推荐阅读指数⭐️⭐️⭐️⭐️⭐️ 使用 Emscripten 写一个属于你的 wasm 推荐阅读指数⭐️⭐️⭐️⭐️⭐️ 胶水代码 推荐阅读指数⭐️⭐️⭐️⭐️ 编译目标及编译流程 推荐阅读指数⭐️⭐️⭐️
模块兼容性 推荐阅读指数⭐️⭐️⭐️ ESM是个啥 推荐阅读指数⭐️⭐️⭐️⭐️ 在浏览器中使用ESM 推荐阅读指数⭐️⭐️⭐️⭐️ 模块指定符 推荐阅读指数⭐️⭐️⭐️⭐️⭐️ 默认情况下,模块是defer的 推荐阅读指数⭐️⭐️⭐️⭐️⭐️ 动态导入 推荐阅读指数⭐️⭐️⭐️⭐️⭐️ import.meta 推荐阅读指数⭐️⭐️⭐️⭐️⭐️ 优化建议 推荐阅读指数⭐️⭐️⭐️ 网站中使用ESM 推荐阅读指数⭐️⭐️⭐️
1. Rust中包和 crate 推荐阅读指数 ⭐️⭐️⭐️⭐️⭐️ 2. 模块控制作用域与私有性 推荐阅读指数 ⭐️⭐️⭐️⭐️ 3. 路径用于引用模块树中的项 推荐阅读指数 ⭐️⭐️⭐️⭐️ 4. use 将名称引入作用域 推荐阅读指数 ⭐️⭐️⭐️⭐️ 5. 将模块分割进不同文件 推荐阅读指数 ⭐️⭐️⭐️
1. 在macOS环境中安装Rust 推荐阅读指数 ⭐️⭐️⭐️⭐️⭐️ 2. 构建一个Rust应用 推荐阅读指数 ⭐️⭐️⭐️ 3. 编译和运行是两个不同的步骤 推荐阅读指数 ⭐️⭐️⭐️ 4. 如何使用Cargo构建Rust应用 推荐阅读指数 ⭐️⭐️⭐️⭐️⭐️
CSS重点概念精讲 JS_基础知识点精讲 网络通信_知识点精讲 JS_手写实现 前端工程化_知识点精讲 前端框架_React知识点精讲 React实战精讲(React_TS/API) Web性能优化_知识点精讲
不读入内存就无法运行 推荐阅读指数 ⭐️⭐️⭐️⭐️ 磁盘缓存 推荐阅读指数 ⭐️⭐️⭐️ 虚拟内存 推荐阅读指数 ⭐️⭐️⭐️ 节约内存的编程方式(DLL文件) 推荐阅读指数 ⭐️⭐️⭐️⭐️ 磁盘的物理结构 推荐阅读指数 ⭐️⭐️⭐️⭐️ 文件以字节位单位保存 推荐阅读指数 ⭐️⭐️⭐️⭐️ RLE算法 推荐阅读指数 ⭐️⭐️⭐️⭐️ 哈夫曼算法 推荐阅读指数 ⭐️⭐️⭐️⭐️ 可逆压缩和非可逆压缩
用二进制数表示计算机信息的原因 推荐阅读指数 ⭐️⭐️⭐️⭐️ 什么是二进制 推荐阅读指数 ⭐️⭐️⭐️⭐️⭐️ 补数 推荐阅读指数 ⭐️⭐️⭐️⭐️⭐️ 逻辑运算 推荐阅读指数 ⭐️⭐️⭐️
延迟和宽带 WebWorker 关键渲染路径 React 应用中的优化处理 利用React-Profiler提升应用性能 从 URL 输入到页面加载整过程分析 SPA 提速 SPA: SEO
常见脚手架 Source Map 推荐阅读指数 ⭐️⭐️⭐️⭐️ Webpack 打包过程 推荐阅读指数 ⭐️⭐️⭐️ 微前端 Webpack Loader vs Plugin 推荐阅读指数 ⭐️⭐️⭐️⭐️ Webpack 生命周期 Webpack编译阶段提效 推荐阅读指数 ⭐️⭐️⭐️⭐️⭐️ Webpack打包阶段提效 推荐阅读指数 ⭐️⭐️⭐️⭐️⭐️ Webpack 缓存优化 推荐阅读指数 ⭐️⭐️⭐️⭐️⭐️
CSS重点概念精讲 JS_基础知识点精讲
选择器 流、元素 盒模型 元素超出宽度...处理 元素隐藏 层叠规则 块级格式化上下文 元素居中 flex布局 Chrome支持小于12px 的文字 CSS 优化处理 (6个) 回流、重绘 硬件加速 Css预编译语言
动态规划基础知识 单序列问题 双序列问题 矩阵路径问题 背包问题
1. Webpack Loader 和 Plugin 的区别 2. Webpack 生命周期 3. Webpack编译阶段提效 a. 减少执行编译的模块 b. 提升单个模块构建的速度 c. 并行构建以提升总体效率 4. Webpack打包阶段提效 a. 以提升当前任务工作效率为目标的方案 • 压缩 Chunk 产物代码 b. 以提升后续环节工作效率为目标的方案 • Code Splitting • Tree Shaking • Scope Hoisting (作用域提升) • sideEffects 5. 缓存优化
我们就从微前端解决了哪些现存前端问题,并在解决这些问题的过程中做出了哪些取舍和权衡。
React Profiler 的组成 推荐阅读指数 ⭐️⭐️⭐️ 如何通过React Profiler查询并改正页面耗时操作 推荐阅读指数 ⭐️⭐️⭐️⭐️⭐️
全局状态管理库需要解决的问题 推荐阅读指数 ⭐️⭐️⭐️⭐️⭐️ 状态管理生态系统的发展史 推荐阅读指数 ⭐️⭐️⭐️⭐️ 解决远程状态管理问题的专用库的崛起 推荐阅读指数 ⭐️⭐️⭐️ 全局状态管理库和模式的新浪潮 推荐阅读指数 ⭐️⭐️⭐️⭐️⭐️ 现代库如何解决状态管理的核心问题 推荐阅读指数 ⭐️⭐️⭐️
TypeScript 是什么 {泛型| Generics} 是个啥 在React中使用泛型
构建解决的问题 包管理工具 任务式构建工具 模块化:模块定义与模块化的构建工具
1. cookie 2. Web Storage a. sessionStorage b. localStorage 3. IndexDB
{服务工作线程|Service Worker} 基础概念 ⭐️⭐️⭐️ 线程缓存 ⭐️⭐️⭐️⭐️ 线程客户端 生命周期 ⭐️⭐️⭐️ 控制反转与线程持久化 updateViaCache 管理服务文件缓存 ⭐️⭐️⭐️ 线程消息 ⭐️⭐️⭐️ 拦截 fetch 事件 ⭐️⭐️⭐️⭐️⭐️
Worker 线程简介 {专用工作线程|Dedicated Worker} 专用工作线程 + Webpack {共享工作线程| Shared Workers }
水平居中 垂直居中 水平&垂直居中
前置知识简讲 浏览器架构 组件结构 代码分析
整数除法 二进制加法 前 n 个数字二进制中 1 的个数 只出现一次的数字
速度是关键 延迟的构成 光速与传播延迟 延迟的最后一公里 网络核心带宽 VS 网络边缘带宽 目标:高带宽和低延迟
IP地址是个啥? 无类型域间选路(CIDR) 公有 IP 地址和私有 IP 地址 MAC 地址 动态主机配置协议(DHCP)
为何SPA对SEO不友好 解决方案 另外增加 SPA 曝光度的方法
作用域 作用域嵌套 词法作用域(lexicsl scope) 闭包 闭包示例
undefined vs null 如何产生undefined和null Null 判断运算符(??)的默认值 [es2020] undefined 和 null 没有任何属性 undefined 和 null的历史
1. CPU = 运算单元 + 数据单元 + 控制单元 2. CPU 只能识别「二进制」的指令 3. 总线像连接 CPU 和内存这两个设备的高速公路 4. 执行高级语言的两种方式:1. 解释执行 2. 编译执行 5. 汇编语言和机器语言是一一对应的 6. 内存中的每个存储空间都有其对应的独一无二的地址 7. CPU时钟周期:取出指令、分析指令、执行指令这三个过程
• 浏览器架构总览 • 进程、线程 • 站点隔离 • 渲染流程总览 • 导航阶段 • UI进程👉拼装URL • 网络进程👉获取数据 • 重定向 • 根据Content-Type进行数据处理 • 唤起渲染进程 • 更新Tab状态 -->导航阶段结束 • 渲染阶段 • 编译处理 • BNF • HTML 解析器 • DOM • 标记算法 • DOM树构建算法 • 处理子资源 • 将CSS附加(attachment)到DOM节点==>生成Render Tree • CSS 解析器 • 创建呈现器 • 属性标准化 • 样式计算并保存到ComputedStyle • 布局(Layout)
a. 组件封装 • RenderProps增强版 • Web Component • 配置化(LCD) b. 逻辑复用 • 中间件(MiddleWare) • Redux Thunk • 监听history • stateComponment
• 1.JS如何在浏览器中运行 • 调用栈 • 堆栈溢出 • Web APIs • 回调队列 • 事件循环 • setTimeout(fn,0) • 工作队列和异步代码 • Promises • promises适合在哪里
随着数字时代的到来,可以说一切的生活,都是基于网络的。而在有些特定的场景中,涉及到私密信息的时候,总是会有心怀鬼胎的人去捏造事实和进行造谣,变成三人成虎的一个尴尬的局面。 所以就需要一种技术去识别私密文本的发布者。从而找出真凶。
执行环境(execution context) 中的 context 有着上下文和环境两层含义。
其实React中组件化,是一个编程思路,我感觉,懒人才可以真正的领略到他的魅力,因为懒人才可以想出让自己书写代码,更快,更高,更强的方式。 这也是一种编程习惯和方式。用最短的时间,写最少的代码,干最漂亮的代码。 希望我啰嗦这么多,能对你有所帮助。如果大家看到有哪里不是很明白的,可以评论区,留言。如果感觉还不是很尽兴。没关系,这些东西,有很多。 其实每天都在吵吵组件化,组件化,组件化是在实际开发项目中,在解决实际业务中,才会有灵感。他主要的目的是解决实际问题,而不是闭门造车。
大多数的高级模式都可以互相组合用于构建一个更加方便的模式。如果想要构建一个比较复杂的程序。可以尝试loose augmentation、private state、 和 sub-modules的组合。
全新对象;给对象赋值;Prototypes;设置属性;对象字面量
在实际项目开发中,不管是后端还是前端,最基本的操作就是数据的CRUD。换句话说,后端是根据某些条件组装数据,前端是拿着后端提供的数据,进行数据展示。但是不管在进行数据封装还是展示,其中在特定的场景下,需要根据某些条件,对数据进行排序。而在既定的现有框架下,都有现成的方法对数据进行排序处理。 但是,在开发中,有没有想过,这些排序底层是如何实现的,还有就是针对不同的数据,不同的排序是否在性能方面有不同的体现。
最近在公司接了一个老项目迁移React。在组件开发过程中,发现有一些组件的处理逻辑很类似。想在某一个地方来统一处理。进过思考和分析,发现HOC(higher-order component)很适合完成此类工作。 再次来总结HOC的概念和基本用法。
组件隔离适用范围 同一个页面引用多个相同的自定义公共组件(该类组件拥有自己的Redux)并且这些组件之间有交互。 案例背景 在一个页面中存在两个相同的公共组件(A),在页面处理中,对A组件进行操作,有一些重要的数据被存入到A组件的对应的Redux中。 如果该页面只存在一个A组件,不管进行如何的操作,数据都是一份。但是如果该页面中存在多个A组件,在对第一个A组件进行数据处理之后,数据存入到Rudex中。此时在对另一个A组件进行相同的操作步骤,但是存入的数据和第一个A组件的存储在Redux中的数据有差别,此时在第二个A组件的操作就会影响第一个A组件的数据。