代码编织梦想

关于elementui中select框在页面滚动时el-爱代码爱编程

前几天在开发一个需求时,无意发现了select超出区域el-option会浮出来问题,我整个人都不淡定了😱,想着正常人应该都不会像我这样反人类操作吧😅... 但是秉着对技术的执着,有问题咱就迎难而上,啥大风大浪没见过的.... 既然已经发现问题,我就开始琢磨为什么会产生这个问题🤔 头脑风暴中,经过思考有了下面的见解... 1

django性能优化:提升加载速度-爱代码爱编程

title: Django性能优化:提升加载速度 date: 2024/5/20 20:16:28 updated: 2024/5/20 20:16:28 categories: 后端开发 tags: 缓存策略HT

css 预先加载部分样式文件打包策略-爱代码爱编程

文章目录 背景webpack loader设置匹配规则webpack plugin 提取不同文件MiniCssExtractPlugin 提取 css 打包进不同的文件HtmlWebpackPlugin 写入不

从浏览器内核到web性能优化:揭秘底层原理与实战技巧-爱代码爱编程

从浏览器内核到Web性能优化:揭秘底层原理与实战技巧 一、浏览器内核与渲染引擎 浏览器内核,也被称为渲染引擎,是浏览器的核心组件,负责解析HTML、CSS和JavaScript,并将这些源代码转换为用户在屏幕上看到的可交

react中setstate是同步的还是异步的-爱代码爱编程

首先说一下setState是同步的还是异步的? 1.解读 setState 工作流  接下来我们就沿着这个流程,逐个在源码中对号入座。首先是 setState 入口函数: ReactComponent.prototy

vue路由切换 & axios接口取消重复请求-爱代码爱编程

在日常前端开发中, 经常会遇到频繁发起的重复请求, 会给服务器及网络造成不必要的压力, 可通过取消重复请求解决 场景 订单数据条件筛选查询 表单提交按钮频繁点击 路由页面切换请求未取消 解决方案: 在每个

面试 css 框架八股文十问十答第二期-爱代码爱编程

面试 CSS 框架八股文十问十答第二期 作者:程序员小白条,个人博客 相信看了本文后,对你的面试是有一定帮助的!关注专栏后就能收到持续更新! ⭐点赞⭐收藏⭐不迷路!⭐ 1)对盒模型的理解 盒模型是指在网页

depcheck检查项目依赖的安装情况-爱代码爱编程

depcheck检查项目缺失的依赖 depcheck介绍与安装介绍安装 depcheck使用基础使用注意 进阶使用 删除多余的依赖注意 depcheck介绍与安装 介绍

vue3页面如何设置rem单位的依据“根font-爱代码爱编程

最近在对项目做整体的自适应。我们可以通过设置meta的viewport属性设置屏幕的缩放,但有时候,屏幕缩放了但字体大小也需要做相应的调整才能达到更好的自适应效果。我们很容易想到使用媒体查询+rem来实现字体的自适应。 rem单位:“rem” 是 “root em” 的缩写,表示相对于根元素(html元素)的字体大小。如果根元素的字体大小为16

像素(物理像素dp、逻辑像素dip、物理像素 / 逻辑像素drp)-爱代码爱编程

1、像素 px实际是pixel(像素)的缩写,它是图像显示的基本单元,既不是一个确定的物理量,也不是一个点或者小方块,而是一个抽象概念。 一个个的小格子被定义为一个单位,叫做 像素 ,2像素就是指占据了两个小格子的大小。当然,我们描述一个图片占的小格子数总不能一个个地数小格子吧,图片是矩形,因此常常描述一个图片尺寸时就说多少乘多少像素,像素就是小格子,

vue 可滑动的tab组件-爱代码爱编程

需求: 1. 每个tab-item的间距是相同的,可定制 2. 每一个tab-item的宽度是随着文字的增多而宽度增大 3. 当tab-item小于等于4个时,tab-item填满当前屏幕,平分剩余空间;当tab-item超过4个时,tab可滑动选择 4. 点击tab-item时,底部横线居中显示,跟随在点击的tab-item底部 5. 从上一个

浏览器中xpath的使用_如何打开网页xpath-爱代码爱编程

概念 XPath (XML Path Language) 是一门在 XML 文档中查找信息的语言,可用来在 XML 文档中对元素和属性进行遍历。 XPath定位在爬虫和自动化测试中都比较常用,通过使用路径表达式来选取 XML 文档中的节点或者节点集,熟练掌握XPath可以极大提高提取数据的效率。 因为XPath解析数据,是基于元素(Element)的

vue组件懒加载-爱代码爱编程

组件懒加载 前言 组件懒加载最常用于异步加载大型/复杂组件或在需要时才进行加载 Vue 2和Vue 3均支持组件懒加载,本文将介绍如何在Vue 2和Vue 3中实现组件懒加载,和一些使用场景 1️⃣方法一:使

使用vue.entends()编写vue插件,然后插入dom元素中_vue2 组件插入在指定dom节点后面-爱代码爱编程

子组件 Son.vue <template> <div> 我是一个子组件内容,里面可以任意拓展 接受到父组件值为{{msg}} </div> </templ

面对大数据量渲染,前端工程师如何保证页面流畅性?_前端数据量大页面卡顿-爱代码爱编程

一、问题背景 在web前端开发中,需要渲染大量数据是很常见的需求。拿一般的业务系统来说,一个模块中往往需要显示成百上千条记录,这已经属于比较大的数据量。而一些大型系统,如数据分析平台、监控系统等,需要同时渲染的 数据量可能

前端优化-爱代码爱编程

我发布了一个工具包,包括了防抖,节流,懒加载等工具函数。可以在 JS 和 TS 项目中使用 : https://www.npmjs.com/package/utils-h GitHub :https://github.

路由懒加载_为什么用箭头函数import可以实现懒加载-爱代码爱编程

路由懒加载 前言 在 spa(单页面应用)项目中,一个路由通常对应着一个页面。如果不做特殊处理,在把项目打包后,所有的页面将打包成一个文件。这种处理方式会导致首页需要一次性加载所有资源,从而影响了用户体验。 为了解决这

vue项目按需引入echarts_echarts按需导入-爱代码爱编程

后台管理系统难免会需要用到图表,Echarts是一款基于JavaScript的数据可视化图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表,深受开发者的青睐。 但是一般的后台管理系用的比较多的是柱状图、饼图或者折线图等,为了用这几个图表而引入了全部Echarts,有点太重,因此我们可以选择按需引入。 1.安装插件

webpack和vite: gzip打包压缩_vite 项目打包为什么有gz后缀的重复文件-爱代码爱编程

前提:最近在研究打包优化,发现webpack和vite写法还是略显不同,记录一下 一、Gzip原理 Gzip压缩是一种http请求优化方式,通过压缩文件体积来提高请求加载速度。需要前端打包生成.gz后缀的文件,同时nginx配置文件启动gzip 二、webpack打包(基于vue2基础) 1. 安装依赖 npm i -D compression-

前端如何优化性能_降低 css 选择器的复杂性-爱代码爱编程

加载时的优化 第一点:减少HTTP请求 一个完整的 HTTP 请求需要经历 DNS 查找,TCP 握手,浏览器发出 HTTP 请求,服务器接收请求,服务器处理请求并发回响应,浏览器接收响应等等一系列复杂的过程。当你请求较多