在CSS中，使用border-radius指定八个半径值时，可以创建不同的形状。先来看一个为该特性制定的工具。@Rachel Andrew今年在苏黎世的前端会议上谈到了CSS Grid布局的优势。在她演讲的最后，她提到了一个在我脑海中挥之不去的CSS 属性:通过border-radius可以使图像有良好的形状效果。听完这个演讲之后，我认为你肯定可以创造出更多的圆圈，并开始深入挖掘使用border-radius可以做什么？

现代Web开发中的CSS离完美还差得远，这并不奇怪。现在，项目通常是相当的复杂的，而CSS样式又是全局性的，所以到最后总是极容易地发生样式冲突：样式相互覆盖或隐式地级联到我们未考虑到的元素。为了减轻CSS存在的主要痛点，我们在项目中普遍采用BEM的方法来。不过这只能解决CSS问题中的一小部分。对我们来说是幸运的，社区已经开发出了可以帮助我们更彻底地解决问题的解决方案。你可能已经听说过CSS Modules、Styled Componetns、Glamorous或JSS。这些只是我们今天可以添加到项目中的一些最流行的工具。如果你对这个话题感兴趣，你可以查看这篇文章：@Indrek Lasn详细介绍了CSS in JS的全部思想。

许多现代JavaScript框架和库的核心概念是能够将数据和UI封装在模块化、可重用的组件中。这对于开发人员可以在开发整个应用程序时避免使用编写大量重复的代码。虽然这样做非常有用，但也涉及到组件之间的数据通讯。在Vue中同样有这样的概念存在。通过前面一段时间的学习，Vue组件数据通讯常常会有父子组件，兄弟组件之间的数据通讯。也就是说在Vue中组件通讯有一定的原则。

使用Vue构建组件容易，但对于初学者要掌握Vue组件中的通讯还是有一定的难度。比如说，父组件如何向子组件通讯？子组件又是如何向父组件通讯？兄弟组件又是怎么通讯？这些方面都是有关于组件通讯相关的知识。而且掌握Vue组件之间的通讯方式还是掌握Vue组件的另一种能力。

Vue中管理应用程序的状态有多种不同的方法，了解状态管理也是学习Vue知识的基础部分，也是很重要的一部分。从这篇文章开始，我们来开始学习Vue应用程序中的状态管理。在这篇文章中会先简单的介绍Vue应用程序中状态管理的大多数方法。希望对Vue的学习者有所帮助。

图片在Web上的使用占比已经非常的高，特别是在手淘互动这样的环境之下，我们每一个项目的图片使用量都非常的大。如果能把图片用好，的确是件不容易的事情，而且面对的挑战也不小。经常会碰到有关于图片如何加载，如何适配，如何优化等等。另外在移动端开发中，很多同学在Web上使用图片的方法一般都是通过<img>标签和CSS的background-image属性来处理。也正因如此，很多同学却忘记了这两者应该如何？怎么使用又是最优的。甚至有很多前端同学都已经忘记了这两者的差异是什么？加上Web的技术不断革新，事实上除了前面提到的加载图片的方式之外，还有其他的方式，比如HTML5的<picture>（虽然这个元素标签曾经一度废弃过，但后来又添加回来了）。就算还是使用img标签，也有了新的优化，比如img的srcset属性。那么面对这么多的变化，以及使用的场景，我们应该怎么来选择，才是最优的选择。今天这篇文章，我们就来一起探讨一下这些东西，希望大家会喜欢。

在开发过程中，经常会遇到要处理大量数据的情况，比如列表、搜索记录等，因此你需要一种方法让用户以块状显示这些数据，以便保持应用程序性能和数据的有序性。你可能会使用分页组件来处理，它可以轻松跳转，甚至一次跳转几个页面。当然，元素滚动是分页组件的另一种替代方案，它可以提供更好的用户体验，特别是在移动端和可触摸设备上。当用记在页面上滚动时，它提供了一个透明的分页，给人一种没有结尾列表的感觉。自从Intersection Observer API出现之后，构建无限滚动组件变得更简单。让我们看看如何通过这个API来构建无限滚动组件。

随着应用程序越来越大，你开始考虑优化应用程序，使其变得更快。在此过程中，你可能使用了拆分代码和延迟加载这两种方法，它们通过将代码块的加截推迟到需要的时候加载，从而使应用程序的初始包变得更小。延迟加载对于应用程序路由有很大的意义，并且有很大的影响，因为每个路由都是应用程序的不同部分。延迟加载有意义的另一种情况是组件延迟渲染。这些组件可以是tooltips、popover、modal等，当然这些组件也可以使用异步组件。让我们来看看如何在Vue中构建延迟加载异步组件。

当你开始使用Vue创建应用程序时，你可以开始先创建组件，来构建应用程序的不同部分。你应该可以感受到Vue和Web组件结构体系的良好开发体验。随着项目的进行，你开始以某种方式构造应用程序组件，可能是按页面和组件。但随着项目的不断发展，你开始要在多个组件之间执行重复的逻辑。我们常常说不要做重复的事情（DRY）和让一切保持它的简单。这两个原则利于我们编写和维护应用程序。也许你已经知道一些有助于遵循这些原则的模式、库和技术。Vuex将帮助你从组件中提取状态逻辑，Vue路由器将对路由逻辑做同样的工作，但是组件呢？我们经常遇到这样的情况，需要重用属于组件的一些UI功能。例如，除了被锚定和定位到元素之外，弹出窗（Popover）和提示框（Tooltip）都可以在某个事件触发时共享打开和关闭的功能。

我是个很懒的人，开发过程中经常有意无意地刻意避开数学相关的知识，你也知道解数学题非常枯燥无趣。平时写动画也尽量使用 CSS3 来实现，timing-function 随意选用，最多也就调一下 cubic-bezier，找到看着舒服的就行。但是怎样让动画更顺滑，写出更贴近自然的动画，说实话以前我没怎么考虑过。每次当动效设计师提出，能不能这样那样的时候，我会理所当然地予以否决。所以有很长一段时间，我非常羡慕那些能用 canvas 绘制很酷炫的动画的程序员。