- 博客(6)
- 收藏
- 关注
原创 懒加载
引入Lazy-Load,翻译过来是“懒加载”。它是针对图片加载时机的优化:在一些图片量比较大的网站(比如电商网站首页,或者团购网站、小游戏首页等),如果我们尝试在用户打开页面的时候,就把所有的图片资源加载完毕,那么很可能会造成白屏、卡顿等现象,因为图片真的太多了,一口气处理这么多任务,浏览器做不到啊!但我们再想,用户真的需要这么多图片吗?不对,用户点开页面的瞬间,呈现给他的只有屏幕的一部分(我们称之为首屏)。只要我们可以在页面打开的时候把首屏的图片资源加载出来,用户就会认为页面是没问题的。至于下面的图片
2021-03-10 21:18:50
130
原创 防抖和节流
引入scroll 事件是一个非常容易被反复触发的事件。其实不止 scroll 事件,resize 事件、鼠标事件(比如 mousemove、mouseover 等)、键盘事件(keyup、keydown 等)都存在被频繁触发的风险。频繁触发回调导致的大量计算会引发页面的抖动甚至卡顿。为了规避这种情况,我们需要一些手段来控制事件被触发的频率。就是在这样的背景下,throttle(事件节流)和 debounce(事件防抖)出现了。节流(throttle)throttle 的中心思想在于:在某段时间内,不
2021-03-10 21:08:04
159
原创 icon的圆环形布局 css
分享最近项目中使用的对icon的圆环形布局的css写法,使用16个点在圆上均匀分布的原理,使用absolute定位,计算相应的top,left。css采用scss语法。先来一波效果图使用React框架进行相关布局import React from 'react';import '../styles/app.scss'const Index: React.FC = () => { return ( <div className="app"> <img
2020-08-16 01:14:56
1116
原创 timeline 时间线的CSS实现方式
最近项目用到的时间线布局,总结一下!timeline 时间线的CSS实现方式,使用vue对实例数组数据循环遍历渲染到页面。HTML部分<div id="app"> <h3>Timeline的CSS实现方式</h3> <div class="timeline"> <div class="history" v-for="(item,index) in list" :key="index">
2020-08-11 21:01:09
1723
原创 复杂度分析总结
复杂度的总结概要最近复习算法,先总结一下最基本的时间复杂度概念和判断方法。常用七种不考虑常数系数。判断: 代码根据n的情况运行的次数O(1)var n = 1000;console.log('输出一次:'+ n )console.log('输出二次:'+ n )console.log('输出三次:'+ n )不关心常数系数,无论输出多少次,复杂度都是O(1)O(n)var n = 5;for (var i = 1; i <= n ; i++){ console.log(
2020-08-10 20:00:23
299
原创 Git分布式开发学习记录
Git 分布式开发学习记录一、目的 用于管理多人协作共同开发项目的技术。用于项目的版本控制(Revision control)。 本地版本控制:记录每次更新,记录版本的补丁文件,个人使用。 集中版本控制(如SVN):所有版本数据保存在服务器,协同开发者同步更新或上传自己的修改。 分布式版本控制(如Git):二、常见版本控制工具 Git , SVN , CVS , VSS , TFS… Git与SVN: Git分布式版本控制系统,无中央服务器,每个人电脑都是完整版本库,无需联网
2020-08-03 23:43:19
266
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人