念念不忘

在最近做的移动端项目开发过程中，交互老师要求做一个播放器在滚动过程中吸顶效果，当时第一反应还会使用js的scroll来做这种交互，但是同事说有css属性sticky也可以实现吸顶效果，最终项目使用的是css的粘性定位sticky来写，基于此，记录下实现吸顶效果的两种方式。 st…

最近在看《代码精进之路》这本书，看了前两章，关于项目工程中命名和规范的部分，觉得深以为然。之前在公司参与过一期大型项目的重构工作，感觉关于命名和规范这块确实值得写一写，因为在重构的第一期工作就是梳理函数，添加注释等之类的工作。 在程序员的工作过程中，大部分的时间在阅读和理解代码…

Flexbox的布局正式名称：CSS Flexible Box Layout Module， 是CSS3中新的布局模块，旨在改善容器中的项目对齐，方向和顺序，即使它们的尺寸是动态的甚至是未知的。flex容器的主要特征是能够修改其子项的宽度或高度，以在不同屏幕尺寸上以最佳方式填充…

由此想到浏览器缓存这块，基于此做以下学习记录。 根据是否需要再次向服务器发起请求来判断分类，分为强缓存和协商缓存。 强缓存相关的HTTP Header头类型是通过Expires和Cache-Control来控制的。 Expires： Expries字段是http1.0时的规范；…

今天再看项目中发现，在window的监听事件rezise、 orientationchange、DOMContentLoaded的回调函数中都使用了setTimeout来刷新rem的计算。看到之后，比较疑惑为什么都要加setTimeout来执行rem的计算，查询了相关资料发现，…

开闭原则（OCP)是面向对象编程中最基础和最重要的设计原则之一。我们在设计程序中使用一些设计模式和遵守相关的设计原则，都是为了可以使我们的程序可以实现“开闭”！说了这么多，那到底什么是开闭原则那？定义如下： 初看这个定义，可能会很迷惑，其实这句话的开放和关闭是可以拆开来讲的。 …

1. iview的tree组件设置expand不生效 测试发现并不生效。 而调用上述treeChangeExpand方法添加expand以后，打印出来的结果中有expand但没有expand的get和set方法。如下： 发现原来vue直接在json数据中添加属性是不行的，无法生…

在移动端web开发过程中，UI设计稿经常出现1px边框，前端工程师在实现的过程中通过border: 1px; 来实现该功能，测试时会发现在有些机型上这个1px边框显示是加粗的效果，这就是移动端1px像素问题。 物理像素（设备像素）：指设备能控制显示的最小物理单位，意指显示器上一…

因为带 key 就不是就地复用了，在 sameNode 函数 a.key === b.key 对比中可以避免就地复用的情况。所以会更加准确。 利用 key 的唯一性生成 map 对象来获取对应节点，比遍历方式更快。 这个默认的模式是高效的，但是只适用于不依赖子组件状态或临时 D…