- 博客(26)
- 收藏
- 关注
RSS订阅原创 ES2020
私有变量 class School { #name = '' constructor(name) { this.#name = name // 类的内部私有变量写法, 外部无法访问 } returnPrivateVar() { return console.log(this.#name); } } let a = new School('Jack') console.log(a.#name); // Uncaught Syntax
2020-05-13 23:50:38
296
转载 前端高级进阶：在生产环境中使你的 npm i 速度提升 50%
对于一个前端应用，或者说是一个 Node 应用，在 CICD pipeline 中，无论是构建，测试，部署，其中必不可少的环节就是依赖安装: npm i。npm i 不仅是必不可少的环节，而且很可能也是耗时最长的一个环节。打蛇打七寸，优化应该从瓶颈处开始，如果能从依赖安装下手，将能极大地缩短部署时间，提高产品交付效率，改善 DevOps 流程，从而促进敏捷开发。CI 环境中的优化不同于本地开...
2020-05-03 14:04:35
562
转载 前端高级进阶：网站的缓存控制策略最佳实践及注意事项
对于一个网站来讲，性能关乎用户体验，你在更短的时间内打开网站，你将会留住更多的用户。如果你的页面十秒才能打开，那再好的用户交互也是徒然。缓存控制是网站性能优化中至为常见及重要的一环，好的缓存控制，除了使网站在性能方面有所提升，在财务方面也有重要提升: 更好的缓存策略意味着更少的请求，更少的流量，更少的峰值带宽，从而节省一大笔服务器或者 CDN 的费用。缓存控制策略就是 http cachin...
2020-05-03 13:54:06
247
转载 前端高级进阶：如何更好地优化打包资源
在前端中但凡谈到打包，肯定要提及到 webpack，毕竟它现在已经是最为流行的打包工具。但 webpack 更多地是表现在 术 上，于是我决定写这篇文章，更多地讲解一些关于 道 的。对于一个前端而言，生产环境的静态资源优化，它既是面试中的高频问题，同时也最容易成为平时工作中的 OKR/KPI。如果你经常致力于优化前端打包提及，必然会对一些数字极为敏感，比如：lodash 和 react gz...
2020-05-03 13:26:09
795
转载 前端高级进阶：javascript 代码是如何被压缩的
随着前端的发展，特别是 React，Vue 等构造单页应用的兴起，前端的能力得以很大提升，随之而来的是项目的复杂度越来越大。此时的前端的静态资源也越来越庞大，而毫无疑问 javascript 资源已是前端的主体资源，对于压缩它的体积至为重要。为什么说更小的体积很重要呢：更小的体积对于用户体验来说意味着更快的加载速度以及更好的用户体验，这也能早就企业更大的利润。另外，更小的体积对于服务器来说也意味...
2020-05-03 12:26:09
560
转载 当前端基建任务落到你身上，该如何推动协作？
前言作为一名野生的前端开发，自打本猿入行起，就未经过什么系统的学习，待过的团队也是大大小小没个准儿：要么大牛带队，但是后端大牛。要么临时凑的团队，受制于从前，前端不自由。要么从 0 到项目部署，都是为了敏捷而敏捷，颇不规范。话虽如此，经过 4 年生涯摧残的废猿我，也是有自己的一番心得体会的。1. 从DevOps流程看前端基建很多专注于切图的萌新前端看到这张图是蒙圈的：DevO...
2020-05-03 00:28:49
182
转载 前端代码规范最佳实践
一千个读者，就有一千个哈姆雷特。一千个程序员，就有一千种代码风格。那什么是代码风格呢？从小的来说，有的开发喜欢带分号，有的不喜欢带分号。有的喜欢使用空格，有的喜欢使用 Tab。有的喜欢空两个空格，有的喜欢四个空格。除了这些，还有一些关于代码的优化，如避免声明未使用，避免冗余的代码逻辑等。如果你是新参加工作的人员，又恰好遇到一个代码风格混乱，密密麻麻赋值前后都不带空格的项目，只能有苦难言了。因...
2020-05-02 23:37:29
194
转载 package.json 知多少？
在 Node.js 中，模块是一个库或框架，也是一个 Node.js 项目。Node.js 项目遵循模块化的架构，当我们创建了一个 Node.js 项目，意味着创建了一个模块，这个模块必须有一个描述文件，即 package.json。它是我们最常见的配置文件，但是它里面的配置你真的有详细了解过吗？配置一个合理的 package.json 文件直接决定着我们项目的质量，本章就带大家了解下 pack...
2019-12-29 00:16:04
444
转载 原生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
596
原创 正则表达式
应用场合数据验证、文本替换、内容检索、过滤内容。理解为：执行字符串函数无法完成的特殊的匹配、拆分、替换功能字面量的形式创建正则规则var reg = /miaohanzhong/var str = 'www.miaohanzhong.com'// 用正则规则匹配字符串，返回值是布尔值var result = reg.test(str)原子是正则表达式中的最小的元素，包括英文、标点...
2019-12-24 00:04:52
142
转载 前端特效-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
886
原创 基于vuecli3.0脚手架项目工程的搭建
文件目录展示api// book.jsimport _axios from "./index";export const book = params => _axios("get", "/book/ebook", params);// index.jsimport axios from "axios"; // 创建axios的一个实例var instance = ax...
2019-10-07 12:42:07
294
原创 工具函数
数组去重// ES5function sampleOne(arr){ let res = [] let obj = {} for(let i = 0; i<arr.length; i++){ if(!obj[arr[i]]){ obj[arr[i]] = 1 res.push(arr[i]) ...
2019-10-07 12:09:37
145
转载 如何看待前端
作者：搞前端的李蚊子www.cnblogs.com/Smiled/p/8377188.html技术方面:第一阶段(新手村)一个前端初学者必须所掌握的核心技能HTML,CSS,JavaScript,这三项是前端最底层的技术支持了,如果你看几年前的回答应该还会有一项jquery,但我个人觉得现阶段的前端圈jquery可以不作为必备技能,虽然Jquery对新人很友好,但现在mvvm框架满天飞Vu...
2019-10-06 19:30:03
417
原创 SVN
SVN概述配套视频效果更佳哦- o-为什么需要SVN版本控制软件解决之道SCM：软件配置管理(所谓的软件配置管理实际就是对软件源代码进行控制与管理)CVS：元老级产品VSS：入门级产品ClearCase：IBM公司提供技术支持，中坚级产品SVN：主流产品什么是SVNSVN全称SubVersionSVN是近年来崛起的版本管理工具，是CVS的接班人。目前，绝大多数软件公司...
2019-10-06 19:28:35
161
原创 用Ps去掉图片的水印
导入想要修改的图片。选择左上角的选框工具，选择自己想要用的选框工具。在这里我们选择【矩形选框工具】，鼠标左键单击选择。（注意：怎么方便怎么来。比如在有些图像上可能用圆形选框工具比较方便,就用圆形选框工具）用选择的矩形工具把 想要去的 框选起来，形成如图所示。选中后会形成虚线，可以看到。然后对着图片选中后会形成虚线，右点击鼠标，选择“填充”选项。出现填充选项内容框，我们选择使用“内容识别...
2019-10-06 19:27:37
490
原创 webAPI
Web API介绍学习目标:掌握API和Web API的概念掌握常见的浏览器提供的API的调用方式能通过API开发常见的页面交互功能能够利用搜索引擎解决问题typora-copy-images-to: mediaAPI的概念API（Application Programming Interface,应用程序编程接口）是一些预先定义的函数，目的是提供应用程序与开发人员基于某软...
2019-10-06 19:27:04
240
原创 jQuery
为什么要学jquery使用javascript开发过程中，有许多的缺点：查找元素的方法单一，麻烦。遍历数组很麻烦，通常要嵌套一大堆的for循环。有兼容性问题。想要实现简单的动画效果，也很麻烦代码冗余。体验jquery的使用/** 1. 查找元素的方法多种多样，非常灵活* 2. 拥有隐式迭代特性，因此不再需要手写for循环了。* 3. 完全没有兼容性问题。* 4. 实现动...
2019-10-06 19:26:48
1057
原创 JavaScript
学习目标:理解面向对象开发思想掌握 JavaScript 面向对象开发相关模式掌握在 JavaScript 中使用正则表达式typora-copy-images-to media课程介绍目标理解面向对象开发思想掌握 JavaScript 面向对象开发相关模式掌握在 JavaScript 中使用正则表达式案例演示贪吃蛇基本概念复习由于 JavaScrip...
2019-10-06 19:26:26
179
原创 前端特效-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
1523
原创 前端特效-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
7052
原创 前端特效-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
340
原创 前端特效-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
762
原创 前端特效-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
440
原创 前端特效-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
1271
原创 前端特效-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
698
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人