lhyt前端之路

33 篇文章
12 人订阅

全部文章

lhyt

提示

在THREEjs中,渲染一个3d世界的必要因素是场景(scene)、相机(camera)、渲染器(renderer)。渲染出一个3d世界后,可以往里面增加各种各...

933
lhyt

七夕了,用代码给心爱的人写一首曲子吧

这里还需要一步:地址栏中输入chrome://flags/#autoplay-policy,把autoplay-policy改成图中所示

843
lhyt

提示

组件已经好了,如果我们要点击,我们怎么知道哪个层级的哪个节点被点了呢?是不是会写一个搜索算法,传入当前节点id,然后回溯去记录路径展示出来?这虽然可以做到,但显...

861
lhyt

提示可能你的react函数组件从来没有优化过React.memome

当16.6的memo问世,函数组件就有了类似PureComponent和shouldComponentUpdate的解决方案,memo的使用方法:

1072
lhyt

提示手把手带你用react hook撸一遍class组件的特性

react hook是继16.6的Suspense、lazy、memo后的又一巨大的令人兴奋的特性。然后有各种文章说了hook的优缺点,其中缺点包括:没有直接替...

1944
lhyt

提示react hook——你可能不是“我”所认识的useEffect前言class组件生命周期模拟useEffect & useLayoutEffect区别

官网已经介绍过,这里再啰嗦一次。useEffect是一个用来执行副作用hook,第一个参数传入一个函数,每一次render之后执行副作用和清除上一次副作用,该函...

3082
lhyt

少年,你渴望元编程的力量吗?——symbol

一些时候,写各种下划线、前后缀,为了实现一个唯一值或者秘密的特殊辅助值,用来辅助业务逻辑或者说作为一个私有的东西:

993
lhyt

记一次preact迁移到react16.6.7的经历

preact作为备胎,但是具有体积小,diff算法优化过的特点,简单活动页用上它是不错的选择。但是考虑到react令人兴奋的新特性,preact并没有按时更新去...

1634
lhyt

一次现网翻车经历与总结

还是和平时一样,做完需求,测试通过,愉快地上线。运营侧在大推,推了好几天。突然有一天,都来反馈说页面自己弹出dialog而且关不掉:

833
lhyt

从一次react异步setState引发的思考0. 前言1. 不想一个个改了2. 不想直接改3. 添加业务生命周期4. 更简单一些吧5. 让我们更疯狂一点

一个异步请求,当请求返回的时候,拿到数据马上setState并把loading组件换掉,很常规的操作。但是,当那个需要setState的组件被卸载的时候(切换路...

1093
lhyt

名字随便起——es6 Proxy 0. 前言1. 拦截展示结果2. 驼峰命名3. 自定义cgi名字

类似Object.defineProperty的set和get,拦截set和get操作进行一些其他逻辑。但是proxy操作的是一个新的代理对象,是对原对象的一个...

823
lhyt

拥抱更底层技术——从CSS变量到Houdini 0. 前言1. CSS变量2. CSS type OM3. paint API4. 自定义属性最后

平时写CSS,感觉有很多多余的代码或者不好实现的方法,于是有了预处理器的解决方案,主旨是write less &do more。其实原生css中,用上css变量...

1172
lhyt

react hook的初步研究前言renderWithHooks的整个过程为什么要顺序调用hook从renderWithHooks开始currentupdateWorkInProgressHook如何

一开始react团队对外宣布hook 的时候,一眼看上去,觉得肯定proxy或者getter实现的,然后在函数组件外面包一层class extend React...

1601
lhyt

从MDN上的canvas例子受到的启发0.前言1.面向对象编程的实践2.相互纠缠的现象3.解决方案4.模拟核裂变5.大鱼吃小鱼

在面对碰撞检测后还有后续动作的情况,必须考虑一下相互纠缠的问题: 如果两个小球被检测到碰撞的时候,而且加上他们的速度下一步还是处于碰撞范围内,就像引力一样无法脱...

1512
lhyt

node框架express的研究0.前言1. 从入口开始1.1入口1.2 proto1.2.1 app.init方法1.2.2 app.handle方法1.2.3 每一个method的处理1.2.4

在node中,express可以说是node中的jQuery了,简单粗暴,容易上手,用过即会,那么我们来试一下怎么实现。下面我们基于4.16.2版本进行研究

873
lhyt

js的this、call、apply、bind、继承、原型链0.前言1.this2.call、apply、bind3.从call到继承

这些都是js基础进阶的必备了,有时候可能一下子想不起来是什么,时不时就回头看看基础,增强硬实力。

1021
lhyt

Rxjs光速入门0. 前言1. Observable2. 产生数据源3. Hot & Cold Observable5. 操作符6. 弹珠图7. Subject总结

Rx指的是响应式编程的实践工具扩展——reactive extension,编程风格是响应式编程+函数式编程。Rxjs则是这种模式的js的实现,处理异步能力优...

2393
lhyt

小白的diff算法试试水之旅0.前言1. 主角1:Element构造函数2. 主角2:render函数3. 大主角: diff函数4. 更新5. 完成

先介绍一下虚拟dom的数据结构,我们都知道源码里面有createElement函数,通过他创建虚拟dom,然后调用render函数。还记得VUE脚手架住入口文件...

1102
lhyt

js随机数生成器的扩展0.前言1.扩展+分区2.二进制法3. 总结

给你一个能生成随机整数1-7的函数,就叫他生成器get7吧,用它来生成一个1-11的随机整数,不能使用random,而且要等概率。

981
lhyt

浏览器原理0. 前言1. 解析过程2. 渲染树2.1 CSS样式计算2.2 构建渲染树3. 布局(重要)4. 重绘与重排(重要)5. paint(绘制)6. composite(重要)7. 浏览器加载

身为前端,打交道最多的就是浏览器和node了,也是我们必须熟悉的。接下来我们讲一下浏览器工作原理和工作过程。从url到页面的过程,......,我们直接来到收到...

2422

扫码关注云+社区

领取腾讯云代金券