背景周末在网上冲浪， 看到个消息：NextJS 9.3 将静态站点生成功能引入了NextJS平台。静态站点生成, 也就是所谓的 SSG : Static Site Generation。喝了口水，顺便回忆了下现在的几种渲染模式：SSR (Server Side Rendering)SSG (Static Site Generation)SSR With hydrationCSR with Pre-renderingCSR (Client Side Render...

背景性能优化是永恒的话题。 我们或多或少都处理过性能优化的需求， 页面的性能优化， 主要是通过减少非必要的渲染来实现。非必要的渲染， 可以是减少渲染的节点数量， 也可以是减少不必要的动画。今天要介绍的就是通过减少antd长列表的动画，来达到优化目的实用小技巧。希望大家看过之后， 留个印象。正文最近在做一个 ...

背景React Hooks 已经出来有段时间了， 很多小伙伴或多或少都用过。今天呢，我们就回头再看一下这个东西，思考一下，这个东西为什么会出现，它解决了什么问题， 以及背后的设计理念。正文如果你有 Hooks 的使用经验， 可以思考一下这两个问题：Hooks 为什么会产生Hooks 解决了什么问题我们先主要围绕这两点展开讨论。1. ...

背景VS Code应该都很熟悉，平时吃饭的工具， 每天都要用。它是微软出的一款轻量级代码编辑器，免费而且功能强大，以功能强大、提示友好、不错的性能和颜值俘获了大量开发者的青睐。对JavaScript和NodeJS的支持非常好，自带很多功能，如代码格式化，代码智能提示补全等。对于VS Code 插件开发， 大家可能不太熟悉， 但是...

背景这一个因为滚动条占据空间引起的bug, 查了一下资料， 最后也解决了，顺便研究一下这个属性， 做一下总结，分享给大家看看。正文昨天， 测试提了个问题， 现象是一个输入框的聚焦提示偏了， 让我修一下, 如下图：起初认为是红框提示位置不对， 就去找代码看： {代码...} 代码上没有什么问题， 不是手动设置的，而且，...

背景本文接上篇， 继续我们的《CSS》 创意构想。因为有一些案例没有代码， 本着学习的态度， 我需要一个个补齐， 也方便大家看。更新的时候可能就按小节， 逐步更新。废话不多少， 开始正文吧。------正文本文的主要内容：混合模式滤镜伪类与伪元素波浪效果滚动指示器滚动视差如何学习CSS1. 混合模式mix-blend-modebackg...

背景本人一直对 CSS 很感兴趣，刚好我们团队有一位擅长CSS的大佬：COCO。于是我找到他， 建议做一期关于CSS的分享， 于是就有了《CSS创意构想》。分享的内容很棒，里面有很多技巧， 有的很实用， 有的很华丽。 听完之后， 我觉得十分受用， 就想结合自己的一些理解，再次整理一番， 加深印象， 二次吸收， 所以就有了今...

我们都知道， AntD 最近喜提了4.0, 更新了许多新特性，看的我是心花怒放， 喜不自胜。 更贴心的是还提供了升级工具，看了一些文章介绍说能三分钟升级。 于是周六的时候， 懒觉我也不睡了， 跑到公司开始了升级之旅。

背景 早上看到几个React 工具包， 看完之后觉得很不错，刚好我后面的一些开发任务也需要用到， 推荐给大家看看。 正文 三个工具 分别是： react-onclickoutside react-lazy-load-image-component react-toastify 1. react-onclickoutside 包如其名， 就是处理点击到元素外部的时候,需要处理的一些事件。 常见于点击容器...

背景下午在搞代码部署的时候， 遇到一个文件大小写的问题， 问题比较简单， 但是也简单整理下， 分享给大家。正文下午在搞代码部署的时候， 线上编译失败了， 看了下错误日志: {代码...} 文件没找到, 可是我看了看代码， 这不是好好地在这吗？到线上仓库看了一下， 文件名是小写的 userModal。怪不得文件找不到。知道错...

背景 周末在家， 极客时间的「覃超」大佬直播了这个话题， 听完觉得十分受用。 我也深有体会, 今天就趁还有印象, 结合一下自己的经历, 和大家简单聊聊这个话题。 技术无关，如果有不认同的地方，可以在留言区交流。 正文 无论我们是刚毕业的萌新， 还是混迹职场多年的老司机， 躲不开的一件事就是跳槽。 跳槽, 意味着离...

背景AST 是非常有用的。今天下午听了小组一个老哥做的AST分享，深以为然。为了加深印象，就写了篇总结，顺便分享给大家，希望能给朋友们一些启发。AST有用，口说无凭， 且看几个具体的案例。且不说： Vue => React React => Vue的代码转换方法，我们就看一个可以无痛升级旧版React的工具：react-codemod代码地址：...

2019 已经过去 2019 已经过去， 去年立的 Flag 完成了90%， 成果十分的喜人。 尝到甜头了，怎么能就此罢手呢。 现在是2020年， 新年的第一天， 不立点儿新的FLag怎么能行。 2020，新一轮的flag 大概这几个部分： 4个方面 1. 基础学习和巩固 落后就要挨打， 不学习不行啊。。。 2. 技术产出 3. 管理技能提升 4. 生活与内...

背景 上一篇文章， 我们熟悉了树， 二叉树， 二叉搜索树的基本概念， 以及做了对应的实战题目： 树， 二叉树， 二叉搜索树 && 实战练习 今天我们继续树这个话题。 本文的主要内容包括： 理论：树的前中后遍历 理论：广度优先搜索 理论：深度优先搜索 理论：树的层次遍历 实战：Leetcode题目演练 树是一种比较常...

背景 树， 是一种常见的数据结构， 有很多的应用场景， 也是面试中的常客。 比如：树的遍历， 分层打印， 平摊的数据转成树， 等等。 这就需要我们对树这种数据结构有个基础的认识，今天我们就再回顾一下这种数据结构。 正文 今天的内容主要包括： 树 二叉树 二叉搜索树 实战题目 树 讲树之前， 我们先回顾下链表。 实际...

背景 中午没事看到了这道题， easy 级别的一个题目， 就用了几种方法做了一下， 给大家伙看看。 题目描述：给定两个字符串 s 和 t ，编写一个函数来判断 t 是否是 s 的字母异位词。 示例 1:输入: s = "anagram", t = "nagaram"输出: true 示例 2: 输入: s = "rat", t = "car" 输出: false 说明: 你可以假设字符串只包含...

前言 时光如白驹过隙，世事如白云苍狗。 2019年， 眨眼就过去了，又到了写年度总结的日子。 今年， 对我来说， 是具有特殊意义的一年。 正文 先简单自我介绍一下吧。 我是皮小蛋， 之所以起这个名字， 是因为养了只蓝猫， 叫皮蛋， 皮小蛋这个名字是养猫之后顺手起的。 皮蛋镇楼： 我是16年毕业的， 到现在毕业三年多了...

先赞再看， 养成习惯 :P 俗话说得好， "时刻准备着"。 算法和数据结构， 对工程师来说是十分重要的。 而这一部分， 靠短期的冲刺学习是很难掌握的。只有靠刻意的学习和不断练习才能掌握。 今天我们就来复习下队列。 了解队列的使用姿势 队列是非常常见的数据结构， 面试中也经常出现。 今天我们就说一下这种数据结构， ...

背景在职业发展的道路上，我们总会面临这样的抉择：是在技术的路上一条路走到黑，做技术专家接触管理， 走上管理年龄大了，搬砖没人要，转型 or 去公司楼下卖炒粉我曾经有个小小的愿望： 在毕业5年内，能做点管理相关的东西。这个愿望，在我毕业的第四年实现了。说起来也我是机缘巧合，遇到了贵人，加上我自己的努力， ...

背景 JavaScript中,数组的遍历我们肯定都不陌生，最常见的两个便是forEach 和 map。 (当然还有别的譬如for, for in, for of, reduce, filter, every, some, ...) 之所以几天要写这个， 是因为前几天写代码的时候犯了一个低级且愚蠢的错误, 最后搞出了个小bug。 最后找到原因， 生气， 甚至还有点想笑， 今天就写一下这两...

背景 Hooks 自推出以来就很火， 它改变了我们编写React 代码的方式， 有助于我们写更简洁的代码。 今天这边文章不是说Hooks的，Hooks之外， 还有很多实用的技巧可以帮助我们编写简洁清晰的代码。 今天我就整理了几个使用的技巧，其中有些也是我在公司项目中实践的，现在整理出来分享给大家， 希望对大家有所启发。 正文 ...

背景最近看了 Chrome Dev Summit 2019 大会视频, 了解到了很多之前不知道的 CSS 新特性，挺有意思的。下面我就介绍几个激动人心的特性。正文特性总览：StickyStickey StackSticy SlideSticky DesperadoFocus-withinprefers-reduced-motionScroll SnapScroll Snap HorizontalScroll Snap VerticalScroll Snap MatrixBackd...

背景 React Hooks 已经推出快一年了，改变了我们的开发方式，也收到了越来越多的开发者的喜爱。 我们平时在开发过程中， 肯定也会自己写一些自定义的Hook， 下面我就分享4个比较实用的， 希望对你有所启发。 正文 1. useTimer 一般处理时间懂， 我们都会习惯性的用moment： {代码...} 但是这个库体积还是比较大的： 一般...

本地新建了一些mysql 的数据库， 之前用的是sequel pro, 但是不知道怎么回事突然用不了， 打开就崩溃， 就换了一个新的工具Navicat.

前言Hooks 是 React 中比较火的一个概念， 用过的小伙伴都说好。但是, 在使用 Hooks 的时候，我们可能会有很多疑惑:为什么 useEffect 第二个参数是空数组，就相当于 ComponentDidMount ，只会执行一次？为什么只能在函数的最外层调用 Hook，不能在循环、条件判断或者子函数中调用？自定义的 Hook 是如何影响使用它的函数...

深入了解 ES6 Modules当下， 我们几乎所有的项目都是基于 webpack、rollup 等构建工具进行开发的，模块化已经是常态。我们对它并不陌生，今天，我们就再系统的回顾一下ES6的模块机制， 并总结下常用的操作和最佳实践， 希望对你有所帮助。一些简单的背景随用随取， 是一种我们都希望实现的机制。在 Javascript 中也一样...

今天写需求的时候发现一个小的优化点：用户选择了一些数据之后, 对应列表中的数据需要高亮， 有时候列表很长， 为了提升用户体验，需要加个滚动， 自动滚动到目标位置。

背景 本文是 「2019年，看了这一份， 再也不怕前端面试了」中的一部分： 参考了之前写过的博客和额外的资料， 分享给大家， 希望能给大家带来一些启发和帮助。 如需转载，请联系作者获得许可。 正文 上下文 是Javascript 中的一个比较重要的概念， 可能很多朋友对这个概念并不是很熟悉， 那换成「作用域」 和 「闭包」呢...

背景 之前出去面试的时候， 经常会被问到一些安全方面的问题。 安全涉及的领域很大， 我也仅仅是了解一些皮毛， 每次面试前都要找资料复习， 很麻烦。 所以我就根据之前搜集的一些资料和面试的经验，系统的梳理了一下，希望对大家有所帮助。 正文 首先简单介绍几种常见的攻击方式： SQL注入 XSS CSRF 点击劫持 中间人攻...

背景 ​2018年写过一次前端面试复盘的文章， 反响很不错。 2019年情况又有所不同， 我就结合去年的一些经验和今年观察到的一些情况再总结一篇， 有需要面试的朋友可以参考下。 先说下我去年面试的一些情况吧. 18年七八月份的时候我出来面试，面试了几家，大概有: 腾讯， 阿里， 有赞， 玖富证券，Shopee， 还有两个不记得...