三木的旅行日记

16年出来工作，工作经验四年，之前主要做平面相关，自己喜欢瞎折腾，从17年开始研究前端，然后公司内部转岗到开发部门工作，算下来前端经验也快三年之久。 年底由于种种原因想换一份工作，但由于太忙，没认真搞简历，也没怎么复习基础，导致很多本来会的都没敢往简历上写。于是写了一个简版的简…

轮播图的实现是面试中经常闻到的一个问题，我们今天就来实现一个简单的轮播图，并且看一下Angular和React版本的Ant Design中轮播图是怎么实现的。 网上有很多轮播图的实现方法，主要思路就像图中表示的一样，将所有的图片平铺，通过设置偏移量，将当前图片移动到可视区域。 …

虚拟DOM（VDOM）是真实DOM的内存表示。将整个UI结构保持在内存中并和真正的DOM结构保持同步。在调用渲染函数和元素展现在屏幕上之间有一个处理过程，这个过程叫做reconciliation。 Shadow DOM 在网络平台中引入作用域样式。 无需工具或命名约定，您即可使…

今天我们就来探究一下。 这涉及到Javascript中的一个常规概念Immutability。 点击按钮触发click事件，想items中添加新的项，但页面并没有重新渲染把加入的项显示在页面上。 这是因为数组是引用类型，当使用push方法修改当前数组的时候，react的状态管理…

这是从30 seconds of code中挑出来的非常有用的一些代码片段，这是一个非常棒的项目，大家可以去github上去搜索一下，给个star。 递归的方法不断调用使用scrollToTop()，requestAnimationFrame方法告诉浏览器——你希望执行一个动画…

最近在使用angular来做项目，今天就简单的聊聊angular的路由管理。 无论是angular还是其它两个主流框架，整体上就是一个大的组件树，包括一些可以复用的UI组件或者业务组件。而路由的作用就是关于如何使用分配这些组件。它来觉得在某种情况下该显示哪些组件，隐藏哪些组件。…

说起HTML，很多人觉得它非常简单，确实，从本质上来说，它都算不上一种语言，只是一种描述型的标签。所以，在写业务的时候，大多数人都是全屏的div和span，完全满足要求，完美实现效果。但HTML仍然提供了很多其它标签，那些都没有用吗？ 嗯... 当然不是。 合理使用语义话的标签…

在第一篇文章中，我们讲解了如何创建一个网格容器，并且介绍了一些用于构造网格的属性。只要创建了网格，你就有了很多的网格线。在这篇文章中，我们将介绍如何通过设置一些属性来对网格的子元素进行布局。 布局属性grid-column-start, grid-column-end, gri…

CSS Grid布局 （又名"网格"），是一个基于二维网格布局的系统，旨在改变我们基于网格设计的用户界面方式。我们常用的Flex 布局是轴线布局，只能指定"项目"针对轴线的位置，可以看作是一维布局，并不适用于复杂的二维布局。网格（Grid）是第一个专门为解决布局问题而创建的CS…