SF
大前端
大前端
注册登录
关注博客
注册登录
主页
关于
RSS
二进制运算实例
lihaixing
2022-10-26
阅读 11 分钟
966
实际使用位运算只可运用于整数,对于 float 和 double 不行。WebGL 游戏数据处理WebSockets、AJAX、Fetch、WebRTC 服务通信WebUSB、WebAudio 硬件通信Crypto 加密算法1. 一些基本用法 位运算 功能 示例 x >> 1 去掉最后一位 101101->10110 x << 1 在最后加一个0 101101->1011010 x << 1 | 1 在...
二进制运算
lihaixing
2022-10-26
阅读 8 分钟
2.7k
一、JS进制 {代码...} 二、原码、反码、补码先让我们看下 1 和 -1 原码、反码、补码然后我们通过这2个数字来解释原码、反码、补码原码:数字的二进制表示有符号数:最高位作为符号位, 0表示+,1表示-无符号数:即无符号位反码:正数和+0 其反码就是原码本身负数和-0 原码基础上,符号位保持不变,其余位数逐位取反,1换...
写个羊了个羊——der了个der
lihaixing
2022-10-08
阅读 11 分钟
1.3k
随着羊了个羊爆火,最近也看到别人写了狗了个狗、猪了个猪之类的,自己也手痒了,因为懒得找图标素材,就从 antd icon 中随便 copy 了一些,名字就叫 der 了个 der 吧,纯属娱乐
ArrayBuffer 二进制数据
lihaixing
2022-10-02
阅读 6 分钟
1.4k
在 Web 开发中,当我们处理文件时(创建,上传,下载),经常会遇到二进制数据。另一个典型的应用场景是图像处理。与其他语言相比,JavaScript 中的二进制数据是以非标准方式实现的。1. 创建二进制数据基本的二进制对象是 ArrayBuffer —— 对固定长度的连续内存空间的引用。 {代码...} 它会分配一个 16 字节的连续内存空...
照片添加水印功能
lihaixing
2022-09-23
阅读 6 分钟
2k
核心代码 {代码...} 工具函数 {代码...} demo尝试[链接]
分片上传方案
lihaixing
2022-09-16
阅读 9 分钟
1.4k
一、index.ts {代码...} 二、sliceUpload.ts {代码...} 三、demo 集成 {代码...}
nginx 如何将 http 转成 https
lihaixing
2022-08-02
阅读 2 分钟
3.5k
下面是将所有的 http 请求通过 rewrite 重写到 https 上。例如将所有的 dev.wangshibo.com 域名的 http 访问强制跳转到 https。下面配置均可以实现:
网站搭建、域名和证书配置
lihaixing
2022-08-02
阅读 3 分钟
2.5k
一、购买云服务器云服务器在哪里买也是一样二、服务器安装各种工具有了服务器,就需要在服务器上装我们需要的工具,主要有以下这些nginx:可以作为静态资源服务,同时能配置域名、代理等,也可以是 php,这个随意git:部署更新一般都会用到 gityarn:习惯了 yarn,npm 也可以node:npm 包三、部署网站有了服务器就可以部...
docker定制镜像
lihaixing
2022-04-23
阅读 3 分钟
980
在之前的例子中,我们所使用的都是来自于 Docker Hub 的镜像。直接使用这些镜像是可以满足一定的需求,但有时候我们就需要定制自己的镜像。
docker介绍
lihaixing
2022-04-23
阅读 7 分钟
947
Docker 最初是 dotCloud 公司创始人 Solomon Hykes 在法国期间发起的一个公司内部项目,它是基于 dotCloud 公司多年云服务技术的一次革新,并于 2013 年 3 月以 Apache 2.0 授权协议开源,主要项目代码在 GitHub 上进行维护。
内存泄露以及map/set/weakMap/weakSet
lihaixing
2022-03-10
阅读 6 分钟
3.4k
由于 js 对未声明变量的处理方式是在window对象上创建该变量的引用。变量在窗口关闭或重新刷新页面之前都不会被释放如果未声明的变量缓存大量的数据,就会导致内存泄露
彻底搞懂webpack原理
lihaixing
2022-02-27
阅读 1 分钟
1.2k
loader和webpack机制webpack打包原理 ? 看完这篇你就懂了 !webpack 手写 loader 与 plugin,手写简易版本的 webpack 手写简易版webpackgithub demo
build your own react
lihaixing
2021-12-12
阅读 12 分钟
1.4k
一、这段代码怎么个逻辑 {代码...} babel帮我们转化(react17以后,react内置了转化工具) {代码...} 最终转成对象type是dom节点的类型, 它是通过document.createElement 创建的标签名称type也可能是个函数,sep II 会讲到children在这里是个字符串, 但是它通常是个数组,包含多个元素. {代码...} 二、react render干了...
简单的webWorker
lihaixing
2021-10-23
阅读 2 分钟
989
html {代码...} main.js {代码...} worker.js {代码...}
DNS Prefetch/preconnect/prefetch/prerender/Preload
lihaixing
2021-08-18
阅读 2 分钟
1.9k
考虑将 dns-prefetch 与 preconnect(预连接)提示配对。尽管 dns-prefetch 仅执行 DNS查找,但preconnect 会建立与服务器的连接。如果站点是通过HTTPS服务的,则此过程包括DNS解析,建立TCP连接以及执行TLS握手。
数据结构与算法
lihaixing
2020-12-28
阅读 1 分钟
1k
一、常用数据结构1、数组、字符串(1)字符串转化由于需要针对字符串当中的每一个字符进行分析和处理,有时候字符串转换成字符数组(2)数组的优点构建非常简单能在 O(1) 的时间里根据数组的下标(index)查询某个元素(3)数组的缺点构建时必须分配一段连续的空间查询某个元素是否存在时,需要遍历整个数组,耗费 O(n) ...
webpack5优化
lihaixing
2020-12-27
阅读 3 分钟
6.4k
(1)optimization.sideEffects = true 开启副作用功能(2)package.json 中设置 sideEffects : false 标记所有模块无副作用
webpack4从0搭建组件库
lihaixing
2020-11-28
阅读 4 分钟
2.1k
一、代码分离代码分离方法有三种:入口起点:使用 entry 配置手动地分离代码。防止重复:使用 SplitChunksPlugin 去重和分离 chunk。动态导入:通过模块中的内联函数调用来分离代码。二、动态导入(dynamic imports)import()require.ensure三、预取/预加载模块(prefetch/preload module)webpack v4.6.0+ 添加了预取和预加...
webpack4升5
lihaixing
2020-11-28
阅读 6 分钟
6.4k
必须使用已适配 webpack 5 的 plugin 和 loader,它们可能存在 beta 版本。当你升级到重大版本的时候,请参考相关 plugin 和 loader 的迁移指南。ExtendedAPIPlugin 已被移除,它的逻辑已经被整合到 APIPlugin 当中。
webpack3升级4
lihaixing
2020-09-17
阅读 1 分钟
1.2k
webpack3升级4 Cannot read property 'Consumer' of undefinedwebpack原理webpack运行机制与核心工作原理webpack原理webpack机制揭秘webpack plugin
前端设计模式
lihaixing
2020-09-06
阅读 8 分钟
1.3k
一、工厂模式工厂模式例子:$() React.createElement() {代码...} 二、单例模式单利模式有:$ 登录框 购物车 vuex和redux中的store {代码...} 登录弹出框实现方式 {代码...} 三、适配器模式使用场景:封装旧接口 vue中的computed {代码...} 四、装饰器模式装饰器模式:添加新功能 装饰一下,不改变原来的功能,只是扩展1...
前端算法题
lihaixing
2020-09-06
阅读 5 分钟
1.6k
1、检测{[]}()是否闭合正确考点:进栈出栈 {代码...} 2、实现以下方法 {代码...} 考点:函数柯里化 {代码...} {代码...} 看打印结果,说明参数每次都在累加 {代码...} 3、深拷贝考点:递归 {代码...} 4、实现方法 {代码...} {代码...} 5、数据扁平化 {代码...} 6、一个整数,计算所有连续数之和考点:二分算法 {代码...}...
从浏览器输入url到页面展示,经历哪些步骤
lihaixing
2020-09-04
阅读 12 分钟
2.1k
一、前端需要注意哪些seo合理的title/description/keywords(权重逐渐减小,每个页面应该不一样)语义化的html代码(容易让搜索引擎理解)主要有header aside section article p footer main等等重要html代码放到最前面(搜索引擎抓取html是从上到下,有的搜索引擎抓取长度有限制)重要的内容不要用js输出(搜索引擎不会...
React——fiber
lihaixing
2020-09-02
阅读 8 分钟
2.6k
一、fiber机理1、浏览器卡顿原因浏览器每秒刷新60次如果浏览器每秒绘制的帧数大于60,那相当于浏览器刷新一次,页面就会发生变化,说明不卡顿但是如果每秒绘制的帧数小于60,那有可能浏览器连续刷新两次,页面一直处于某一帧,说明页面卡顿了js的执行,如果占用空闲时间太长(超过了空闲时间),那就导致一直不能绘制,...
重学react——router
lihaixing
2020-09-02
阅读 4 分钟
1.7k
{代码...} 原理 {代码...} 系列重学react——slot重学react——state和生命周期重学react——redux重学react——hooks以及原理重学react——context/reducer重学react——router重学react——高阶组件build your own reactReact——fiber
重学react——redux
lihaixing
2020-09-01
阅读 5 分钟
1.7k
一、redux使用redux使用和之前的useReducer使用比较类似(详情请看 重学react——context/reducer 一文) {代码...} {代码...} {代码...} 从上述我们可以将redux和useReducer/useContext作对比重学react——context/reducer二、手写Redux1、createStore {代码...} 2、中间件 {代码...} {代码...} 系列重学react——slot重学rea...
typescript笔记(2)
lihaixing
2020-08-31
阅读 6 分钟
1.4k
typescript类型1、函数多参 {代码...} 2、函数重载 {代码...} 3、泛型问题: {代码...} 方案: {代码...} {代码...} {代码...} {代码...} 泛型类型 {代码...} 4、类4.1 private static public protected测试案例 {代码...} 4.2 可选属性 {代码...} 4.3 get & set {代码...} 4.4 抽象类和抽象方法 {代码...} 4.4 接口...
typescript笔记
lihaixing
2020-08-27
阅读 11 分钟
1.9k
一、编译选项配置文档文档2tsc --initoutDir: 编译输出目录target: 指定编译的代码版本目标 默认ES3watch: 监听模式,只要文件变更,会自动编译 {代码...} 配置编译文件tsconfig.json {代码...} 二、类型系统1、基础类型 {代码...} 2、空和未定义类型 Null和undefined {代码...} null和undefined是所有类型的子类型 {代...
重学react——hooks以及原理
lihaixing
2020-08-26
阅读 7 分钟
3.6k
有一个问题,就是当改变input的值时,控制台打印出了 "child render", 这是为什么,改变input的值只是改变了name的值,而data.count并没有变
重学react——context/reducer
lihaixing
2020-08-25
阅读 3 分钟
2k
1、context概念context也就是上下文,方便子级组件共享数据,看个栗子就知道了 {代码...} 我们可以看出虽然Child可以获取到数据,但是使用并不方便,如果是多层子组件,就不好用了二、useReducer16.8以上react-hook中提供了useReducer方法很好的解决了这个问题,用法如下store 文件 {代码...} container组件 {代码...} c...
1
(current)
2
下一页
1
(current)
下一页