- 博客(14)
- 收藏
- 关注
RSS订阅转载 前端高级进阶：网站的缓存控制策略最佳实践及注意事项
对于一个网站来讲，性能关乎用户体验，你在更短的时间内打开网站，你将会留住更多的用户。如果你的页面十秒才能打开，那再好的用户交互也是徒然。缓存控制是网站性能优化中至为常见及重要的一环，好的缓存控制，除了使网站在性能方面有所提升，在财务方面也有重要提升: 更好的缓存策略意味着更少的请求，更少的流量，更少的峰值带宽，从而节省一大笔服务器或者 CDN 的费用。缓存控制策略就是 http cachin...
2020-05-03 13:54:06
294
转载 前端高级进阶：如何更好地优化打包资源
在前端中但凡谈到打包，肯定要提及到 webpack，毕竟它现在已经是最为流行的打包工具。但 webpack 更多地是表现在 术 上，于是我决定写这篇文章，更多地讲解一些关于 道 的。对于一个前端而言，生产环境的静态资源优化，它既是面试中的高频问题，同时也最容易成为平时工作中的 OKR/KPI。如果你经常致力于优化前端打包提及，必然会对一些数字极为敏感，比如：lodash 和 react gz...
2020-05-03 13:26:09
854
转载 前端高级进阶：javascript 代码是如何被压缩的
随着前端的发展，特别是 React，Vue 等构造单页应用的兴起，前端的能力得以很大提升，随之而来的是项目的复杂度越来越大。此时的前端的静态资源也越来越庞大，而毫无疑问 javascript 资源已是前端的主体资源，对于压缩它的体积至为重要。为什么说更小的体积很重要呢：更小的体积对于用户体验来说意味着更快的加载速度以及更好的用户体验，这也能早就企业更大的利润。另外，更小的体积对于服务器来说也意味...
2020-05-03 12:26:09
588
转载 当前端基建任务落到你身上，该如何推动协作？
前言作为一名野生的前端开发，自打本猿入行起，就未经过什么系统的学习，待过的团队也是大大小小没个准儿：要么大牛带队，但是后端大牛。要么临时凑的团队，受制于从前，前端不自由。要么从 0 到项目部署，都是为了敏捷而敏捷，颇不规范。话虽如此，经过 4 年生涯摧残的废猿我，也是有自己的一番心得体会的。1. 从DevOps流程看前端基建很多专注于切图的萌新前端看到这张图是蒙圈的：DevO...
2020-05-03 00:28:49
220
原创 前端特效-HTML+CSS+JS - 原生JS实现加载进度条
分享一个原生JS实现的动态加载进度条特效，效果如下：实现的代码如下：<!DOCTYPE html><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>原生JS实现加载进度条</...
2019-12-24 00:43:26
653
1
转载 前端特效-HTML+CSS -一个div实现不同的UI图标
实现的效果html部分<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta h...
2019-11-03 17:47:36
982
原创 用Ps去掉图片的水印
导入想要修改的图片。选择左上角的选框工具，选择自己想要用的选框工具。在这里我们选择【矩形选框工具】，鼠标左键单击选择。（注意：怎么方便怎么来。比如在有些图像上可能用圆形选框工具比较方便,就用圆形选框工具）用选择的矩形工具把 想要去的 框选起来，形成如图所示。选中后会形成虚线，可以看到。然后对着图片选中后会形成虚线，右点击鼠标，选择“填充”选项。出现填充选项内容框，我们选择使用“内容识别...
2019-10-06 19:27:37
532
原创 前端特效-HTML+CSS+JS -3D翻转动画效果的名片
实现的效果项目需要的图片资源html部分 + js部分<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" ...
2019-10-06 19:12:28
1591
原创 前端特效-HTML+CSS+JS - 登录注册界面
实现的效果项目需要的图片资源html部分 + js部分<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" ...
2019-10-06 18:24:18
7097
原创 前端特效-HTML+CSS - 炫酷加载效果
实现的效果html部分<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta h...
2019-10-05 23:04:22
372
原创 前端特效-HTML+CSS - 荧光边框
实现的效果html部分<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta h...
2019-10-05 23:04:07
808
原创 前端特效-HTML+CSS - 左侧滑动进入
实现的效果html部分<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta h...
2019-10-05 22:59:21
474
原创 前端特效-HTML+CSS - 图片悬浮效果
实现的效果html部分<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta h...
2019-10-05 22:56:35
1332
原创 前端特效-HTML+CSS - 4种图标hover动画
实现的效果html部分<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta h...
2019-10-05 22:53:08
740
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人