- 博客(71)
- 资源 (4)
- 问答 (4)
- 收藏
- 关注
RSS订阅原创 前端八股文面试题——webpack工程化
代码分割是将一个应用程序的代码拆分成多个独立的块，以便可以按需加载。可以减少初始加载时间提高页面性能，在 Webpack 中配置实现代码分割，有以下多种方式：1、入口起点配置：配置多个入口起点，不同部分打包成独立的代码块。2、动态导入 （Dynamic import）:可以将模块作为单独的代码块按需加载，这样模块需要时才会下载执行，3、使用 SplitChunksPlugin 插件来自动分割代码。自动拆分公共模块，并创建独立代码块，避免重启加载，提高缓存利用率。
2024-04-06 00:16:39
854
原创 React-native环境配置与项目搭建
产生这个问题的原因是：使用这种方式创建工程，在react-native 版本是0.69 版本上不适用。各位可以检查下自己安装的React-native的版本。那就是没有安装react-native 脚手架，执行：npm install -g react-native-cli。安装 react native 脚手架 (npm install -g react-native-cli)yarn android (运行项目) 或者yarn react-native run-android。
2023-09-02 21:51:49
417
原创 前端算法排序
计数排序不是比较排序，排序的速度快于任何比较排序算法。由于用来计数的数组C的长度取决于待排序数组中数据的范围（等于待排序数组的最大值与最小值的差加上1），这使得计数排序对于数据范围很大的数组，需要大量时间和内存。它的工作原理：首先在未排序序列中找到最小（大）元素，存放到排序序列的起始位置，然后，再从剩余未排序元素中继续寻找最小（大）元素，然后放到已排序序列的末尾。桶排序最好情况下使用线性时间O(n)，桶排序的时间复杂度，取决与对各个桶之间数据进行排序的时间复杂度，因为其它部分的时间复杂度都为O(n)。
2023-08-07 13:51:49
314
原创 H5新特性——requestAnimationFrame
和定时器 setTimeout()、setInterval() 是相关的，因为requestAnimationFrame 是H5新增的API，是为了解决定时器时间间隔不稳定的问题，屏刷新频率是 60HZ ==> 也就是每秒60次. ==> 相当于1000毫秒60次 = 16.67ms一次。也就是说每16.67毫秒刷新一次是浏览器显示的最大刷新频率。我们一般设置16或者17 接近这个频率。// 是异步API,必须要等待同步任务后执行，具体说要等待微任务完成才会执行。
2023-07-05 10:12:10
498
原创 TypeScript类型
当对变量的声明和赋值是同时进行的，TS编译器会自动判断变量的类型。所以如果你的变是的声明和赋值时同时进行的，可以省略掉类型声明。如果变量的声明和赋值是同时进行的，TS可以自动对变量进行类型检测。JS 中的函数是不考虑参数的类型和个数的。如果是ts，参数类型限制，个数也有限制。在参数小括号后面加类型设置函数的返回值。TS拥有自动的类型判断机制。声明完变量直赴进行赋值。
2023-05-30 11:59:44
827
原创 css 怎么实现响应式布局
1、：媒体查询允许根据设备的特性（如屏幕宽度、高度、设备类型等）来应用不同的CSS样式。通过定义不同的媒体查询规则，可以针对不同的设备或屏幕尺寸应用不同的布局和样式。2、：Flexbox是一种弹性盒模型，提供了灵活的布局方式。通过使用display: flex和相关的Flexbox属性，可以实现自适应的、响应式的布局。3、：栅格系统是一种基于网格的布局方式，通过将页面划分为列和行，可以轻松地创建响应式布局。使用CSS网格布局（CSS Grid Layout），可以在网格中定义不同的区域和布局。4、
2023-05-22 21:07:34
1643
原创 vue3 新特性详解（2）
例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。提示：以下是本篇文章正文内容，下面案例可供参考。
2023-05-19 11:24:35
205
原创 vue3 新特性详解（1）
vue3中的新配置项，值为一个函数，组件中所用到的数据，方法等等，均要配置在setup中，2、若返回一个渲染函数，则可以自定义渲染内容注意*：1、尽量不要与vue2配置混用。vue3是向下兼容的，vue2中的data(),methids:{}…可以访问到setup中的属性，方法。但在setup中不能访问到vue2配置的data(),methids:{}…。如果有重名setup优先。
2023-05-17 16:38:11
527
原创 vue3项目搭建
npm 也是 Node.js 的默认的包管理器。一旦 node 安装，npm 也会被默认安装。yarn 是 facebook 等公司在 npm v3 时推出的一个新的开源的包管理器，它的出现是为了弥补 npm 当时安装速度慢、依赖包版本不一致等问题。如果之前安装了2.0的脚手架，要先卸载掉，输入：npm uninstall vue-cli -g 进行全局卸载。输入项目名crm_vue3,选择框架vue，选择typeScript回车就搭建好了。选择安装依赖项时要使用的包管理器：（使用键盘上下箭头键）
2023-05-08 10:49:00
3336
原创 JS文件断点续传的切割与合并
总结一下大文件分片上传和断点续传的问题。因为文件过大（比如1G以上），必须要考虑上传过程网络中断的情况。http的网络请求中本身就已经具备了分片上传功能，当传输的文件比较大时，http协议自动会将文件切片（分块），但这不是我们现在说的重点，我们要做的事是保证在网络中断后1G的文件已上传的那部分在下次网络连接时不必再重传。所以我们本地在上传的时候，要将大文件进行分片，比如分成1024*1024B，即将大文件分成1M的片进行上传，服务器在接收后，再将这些片合并成原始文件，这就是分片的基本原理。断点续传要求本地
2023-04-27 10:42:18
903
原创 浏览器渲染页面的原理及流程
1、渲染引擎首先通过网络获得所请求文档的内容2、解析HTML文件，构建 DOM Tree3、解析CSS，构建 CSSOM Tree(CSS规则树)4、将 DOM Tree 和 CSSOM Tree合并，构建Render tree(渲染树)5、reflow(重排、回流)：根据Render tree进行节点信息计算（Layout）6、repaint(重绘)：根据计算好的信息绘制整个页面（Painting）
2023-04-26 15:56:21
773
原创 浏览器缓存原理
流程：浏览器发送请求，然后服务器在返回资源的时候，在响应头里添加last-modified这个字段值为服务器资源的最后修改时间，然后浏览器在每次请求的时候都会带上上一次返回的最后修改时间，之后交给服务器，服务器拿到值去跟服务器当前的最后修改时间去做比对，如果比对没变化就告诉浏览器可以使用缓存并返回304状态，如果比对结果是资源已经更新了就给浏览器正常返回资源并返回状态200。
2023-04-26 15:49:08
516
1原创 web关于性能的那些问题
浏览器下载HTML后，首先解析头部代码，进行样式表下载，然后继续向下解析HTML代码，构建DOM树，同时进行样式下载。理想情况下，样式表下载速度够快，DOM树和CSSOM树进入一个并行的过程，当两棵树构建完毕，构建渲染树，然后进行绘制。（First Contentful Paint），指的是浏览器从响应用户输入网址地址，到首屏内容渲染完成的时间，此时整个网页不一定要全部渲染完成，但需要展示当前视窗需要的内容。，浏览器解析HTML遇到了内联JS代码，此时，浏览器暂停JS脚本执行，暂停HTML解析。
2023-03-28 16:28:25
561
原创 H5移动端下拉 - mobileSelect
H5移动端下拉 - mobileSelect <link rel="stylesheet" type="text/css" href="/css/mobileSelect.css"> <div class="row_val inputs" id="triggerSel"></div> <script type="text/javascript" src="/js/mobileSelect.min.js">
2022-04-25 14:26:02
1453
原创 react-router-dom v6基础
react 配置路由-入门版## 项目下执行命令npm install --save react-router-dom或者npm install react-router-dom@6新建文件： pages/Home/index.jsximport React from "react";const Home = () =>{ return( <div> Home 首页 </div> )}expo
2022-04-22 09:09:27
209
原创 js或者月和周不能时间段的数据
获取今天日期格式function now_day_scope() { var date = new Date(); var today = date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate(); return [today + " 00:00:00", today + " 23:59:59"]}function com_to_day() { var date = new Date(
2021-12-31 16:29:09
442
原创 js计算日期时间距离现在多久
js计算日期时间距离现在多久//距离现在时间多久function dateDiff(hisTime, nowTime) { if (!arguments.length) return ''; var arg = arguments, now = arg[1] ? arg[1] : new Date().getTime(), diffValue = now - new Date(arg[0].replace(/-/g, '/')).getTime(),
2021-10-18 10:57:46
1308
原创 js 金额转大写
/******************************************* * 金额转换大写 *******************************************/ function showChinaValue(val) { var totalValue = val; var minusFlag = false; if (totalValue < 0) { minusFlag = true; totalValue = M.
2021-07-07 12:01:08
196
原创 CSS 流星雨
流星雨效果代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> &l
2021-05-28 09:34:20
684
原创 前端特效（仿博客）
效果蜘蛛网 + 点击向上飘不同颜色的爱心<!DOCTYPE html><html lang="en"><style> .heart { width: 10px; height: 10px; transform: rotate(45deg); margin-top: 4px; margin-left: 4px; } .heart::before {
2021-05-26 16:13:30
155
原创 网页简单Live2D动画插入
《Live2D》是一种应用于电子游戏的绘图渲染技术，技术由日本Cybernoids公司开发。通过一系列的连续图像和人物建模来生成一种类似三维模型的二维图像，对于以动画风格为主的冒险游戏来说非常有用，缺点是Live 2D人物无法大幅度转身，开发商正设法让该技术可显示360度图像。效果代码 <html lang="zh-CN"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compa
2021-05-25 17:34:07
1482
原创 wangEditor 富文本编辑器
wangEditor 富文本编辑器效果如下：代码：<div id="fdEmailContext" style="width: 99%;"></div>导入<script type="text/javascript" src="../wangEditor/wangEditor.min.js"></script>javascript const E = window.wangEditor const editor = new E("#
2021-05-14 16:28:06
739
bootstrap4-editable.7z
2020-08-02
bootstrap4.zip
2020-08-02
uniapp使用Pinia 报错
2023-06-29
http status为401时，避免浏览器弹出认证框
2022-02-18
ajax 401 但postman成功
2022-02-17
Date.getTime() 的问题
2021-03-31
vscode 下载不了插件
2021-01-06
TA创建的收藏夹 TA关注的收藏夹
TA关注的人