娃哈哈_的博客

前言随着业务场景越来越复杂，前端技术也越来越丰富，这几年也迎来爆发期，【大前端】的概念逐渐涌现。本图根据本人理解整理，如有不足，欢迎指正，感谢~一、【终端】PC端PC端浏览器网页桌面端electron（chrome v8引擎+web技术）移动端主要是和APP原生的混合开发二、【业务场景】前台面向用户中后台管理系统、配置平台CRM系统等三、【技术】网页技术前端工程化中间件服务后台服务欢迎大家指正和补充~...

前言防抖和节流属于性能优化的知识。它们都是基于短时间内高频的操作场景，例如输入，点击，滚动等，下面介绍下结合vue组件的具体使用一、防抖对于短时间内连续触发的事件，防抖就是不立即执行事件，给出一个时间期限（如1000毫秒），若在时间期限内再次触发，取消之前时间计时，重新开始计时；若无再次触发，则在时间期限到后执行。最终效果：如果短时间内高频触发同一事件，只会执行一次函数。示例：点击按钮的防抖<template> <button @click="clickme">点

系列文章目录webpack 基础搭建文章目录系列文章目录前言一、创建项目二、安装基本依赖包1、webpack三大件2、处理JS的三大件3、处理CSS4、处理HTML三、配置四、配置命令五、启动项目总结前言从头搭建一个webpack项目，一定要有清晰的思路去做这件事情。虽然配置众多，只要掌握好思路就会从容不迫。一、创建项目新建目录mkdir webpack-project创建package.jsoncd webpack-projectnpm init 二、安装基本依赖包1

css 水平举止居中方案【面试必备】

文章目录前言一、前端模块化是什么？二、前端模块化要解决什么问题？1.引入库2.读入数据三、前端模块化的发展总结前言前端模块化发展了10余年左右，前前后后出现了commonJS,AMD,CMD等多种模块化标准方案，目前最新的是ES module。下面大概讲述一下这十年左右的发展历程~一、前端模块化是什么？示例：p

前言：sass和Less等css预处理器，已经被前端工程师们应用了好多年了，其中很多变量、函数、嵌套等规则让我们写起css来非常高效。在新一代的css规范中，也慢慢加入了一些新特性，支持css的动态编写等。虽然目前浏览器支持度不是很好，但一定是未来的趋势~文章目录前言：一、css新特性1、支持变量var()2、自定义属性集3、计算属性方法calc()4、语义化的媒体查询@custom-media5、嵌套写法&6、 image-set() 函数7、color() 函数二、在vue-cli4中使用

文章目录前言一、position: sticky[css]二、代码实现1.表头吸顶2.第一列固定源码链接前言在后台管理系统中，经常会有大量表格，且表格内容很多。我们通常为了方便浏览数据，需要对表格做一些特效，今天我要用最简单的CSS属性position实现的是：【表头吸顶】，【固定第一列】。提示：以下是本篇文章正文内容，下面案例可供参考一、position: sticky[css]sticky 英文字面意思是粘，粘贴，所以可以把它称之为粘性定位。position: sticky; 基于用户

一、背景在chrome浏览器运行前端项目时 ，发现页面渲染很慢，F12打开控制台- network，发现有些请求响应时间长达7s多的时间，点击查看timing如下：如上图所示，该http请求的 waiting(TTFB)时间很长~二、几个重要的概念(加粗为重点)1、Queueing（队列）【资源调度】期间，浏览器有自己的线程限制，所有的请求不可能都能够同时发送，一般chrome的最大并发连接数为6，根据请求顺序，会将所有请求加入队列中，此概念表示在队列所耗费等待的时间。2、Stalled（阻塞

一、 问题背景微信公众号的H5页面，在新版本上线后部分用户无法获取最新的页面文件二、无法获取新版本页面的用户特征在上线前某段时间内，访问过该H5页面，手机本地存有该H5页面的缓存三、解决方案【亲测可行】对于JS和CSS静态文件【取以下两种方案其一即可】（1）在引用时加上动态版本号，例如<script src="index.js?v=2.5.0" />（2）动态命名问题，例如利用webpack等打包工具生成HASH文件名<script src="index.123213

一. create-react-appnpx create-react-app react-demo —typescript 默认情况下，生成的项目支持所有现代浏览器。对Internet Explorer 9、10和11的支持需要polyfill。通过npm run eject ， 暴露webpack配置学习网站：https://create-react-app.dev/docs/g...

前言vscode是一个轻量的开发编辑器，对前端开发者来说特别友好。其中一个强大的功能就是插件扩展，适当地使用某些插件，可提高我们的工作效率。如何安装插件1、插件位置2、搜索插件3、安装插件install重载vscode那些年我使用过的插件Preview on Web Server以服务方式打开本地html文件...

安装安装homebrew（mac的包管理器）/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"确认是否安装成功：brew -v安装nginx brew install nginx确认是否安装成功：nginx -v启动nginx(默认...

1、计算属性和方法的区别参考官方回答：https://cn.vuejs.org/v2/guide/computed.html2、父组件访问子组件实例的方法 vm.$children——不保证顺序，也不是响应式的 vm.$slots——用来访问被插槽分发的内容。每个具名插槽 有其相应的属性 (例如：slot=&quot;foo&quot; 中的内容将会在 vm.$slots.foo 中被找到)。defa...

首先想到按照首字母的unicode编码排序：Unicode编码范围如下：| 类型 | 16进制范围 | 10进制范围| 数字 |【0x30,0x39】 | 【48,57】| 大写字母|【0x41,0x5a】 | 【65,90】| 小写字母|【0x61,0x7a】 | 【97,122】| 汉字 |【0x4e00,0x9fa5】 | ...

近期做了一个小程序，在采坑的路上总结了一些实践经验，分享给大家~~场景一：想调试一个页面，默认进来显示想要调试的页面。因为小程序每次重新编译后都会默认显示配置的默认首页。app.json文件：将对应的页面放入Pages数组第一个。场景二：获取整个APP，可以调用app.js中公用的方法var appInstance = getApp()；场景三：userBaseForm为data中...

三者比较：第一个参数都是this要指向的对象，也就是想指定的上下文；都可以利用后续参数传参；bind 是返回对应函数，便于稍后调用；apply 、call 则是立即调用 。apply、call应用1、数组之间追加var array1 = [12 , “foo” , {name “Joe”} , -2458];var array2 = [“Doe” , 555 , 100];Arra...

git中显示：显示"没有活动的源代码控制提供程序“处理1、扩展程序git可能未启动扩展程序——输入**@builtin**——找到git——启动——重启vscode2、配置git.path进入setting位置：在设置中找到“git.path”，会发现后面路径为null，修改为git的安装位置。“git.path”: “D:/Program Files/Git/bin/git.e...

1、params设置在路由里面：/home/:id =&amp;gt; this.$route.params.id;页面刷新后可以保留params参数也可不设置在路由里面：this.$router.push({name:‘首页’, params:{id:123&quot;})必须用name跳转页面刷新后无法保留params参数，那依赖这个参数的http请求或者其他操作可能就会失败。2、qu...

导言今日别人突然想我提起了fetch,还问了和ajax有何区别。我当时一脸懵，虽然之前看到别人使用过fetch,但没有深入了解。近日研究了一下分享给大家~~你所熟悉的ajax相信大家对ajax的理念和用法，已经非常熟悉了，毕竟这门技术已经1998年前后就得到了应用，已经发展了十几年。在前后端通信领域占据着重要地位！核心对象：XMLHTTPRequest在利用XMLHttpRequest对...