自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

为了WLB努力

努力是为了看更广阔的天空,持续定时推送前端技术干货,搜索关注微信公众号:为了WLB努力

  • 博客(55)
  • 收藏
  • 关注

原创 前端说你的API接口太慢了,可是真的有几千万条数据啊!怎么办?

通过合理的分页加载、索引优化、数据缓存、异步处理、压缩数据等手段,可以有效地优化接口性能,提升系统的响应速度。如果可能的话,通过分页加载数据来减少每次请求返回的数据量。这样可以减轻服务器的负担,同时也减少了前端需要处理的数据量。确保数据库表中的字段上建立了合适的索引,这样可以加快查询速度。分析常用的查询条件,并在这些字段上建立索引,这样可以大幅提升查询效率。如果数据不经常变化,可以考虑将数据缓存到内存中或者使用缓存服务,减少对数据库的频繁查询。这样可以大幅提高接口的响应速度。

2024-04-12 19:12:35 1515

原创 盘点那些常用的数据库以及各自的原理和特点,你能一口气把它简单明了的说一下吗?

我们都知道,常用的后端数据库包括关系型数据库和非关系型数据库两种类型,每个类型市场上都有主流的数据库,就像前端的react,vue一样,但,会用归会用,你能说明白,他们都有哪些?分别什么特点,怎么用的吗?下面我来分别介绍它们及其原理,并附上实例代码说明用法,看看是不是你心中的标准答案。

2024-03-29 07:30:00 1286

原创 想学高并发技能,这些常用的消息中间件( RabbitMQ、Kafka、ActiveMQ、Redis、NATS )你要必知

对于全栈或者后端工程师来说,解决高并发是一个必备的技能,一说到高并发时,我们第一反应是分布式系统,那么,消息中间件(RabbitMQKafkaActiveMQRedisNATS等)的出现是为了解决分布式系统中的消息传递和异步通信的问题,以及提供可靠的消息传递机制。它们在不同的场景和需求下提供了各自的优势和特点。

2024-03-28 07:30:00 2156

原创 什么年代了,别跟我说你还不会用docker镜像去做前端项目发布?

Docker 已经成为现代软件开发与部署的标准之一。然而,要真正理解 Docker 的工作原理,首先需要深入研究其底层技术。本文将深度解析,包括容器与镜像的概念、Docker 架构、命名空间与控制组、镜像分层、容器生命周期管理等,并结合展示其应用,让你学以致用。

2024-03-26 15:51:03 913

原创 深度解析webpack5以及打包实践攻略,看完这篇带你玩转高级自定义打包

webpack5如果,简单的webpack5框架无法满足你项目的业务需求,下面我们可以配置一些高级玩法,比如,配置多入口文件,搭载多页面应用,多页面应用利于SEO,在上述代码文件的基础上,新增文件配置自定义入口,const files = glob.sync('./src/pages/**/index.js') //多文件入口的路径if (ret) {})// 拆分vue依赖if (ret) {minify: {},}))${

2024-03-23 07:30:00 1581

原创 H5人脸识别项目,代码免费开源啦,可以不写但一定要看会,万一未来用上了呢

用处广泛应用的人脸识别成了当今大型项目实名认证的标配,移动端人脸识别轻松搞定,废话不多说,直接上干货,下面我将介绍一下H5人脸识别前端技术实现步骤:1.调取手机摄像头并成功打开摄像头2.针对不同机型的手机做好UI兼容,调取摄像头时因为安卓手机和苹果手机会出现兼容问题,比如苹果手机成像出现镜像问题,而且部分配置较低的安卓手机无法直接根据后置摄像头id打开后置摄像头,需要动态切换才能打开3.对不同机型的成像图做出特俗处理。

2024-03-22 07:30:00 1143

原创 2024金三银四前端面试划重点了,讲清楚了就是逢面必过

for in对象就是key,数组就是下标,字符串就是引用地址。for … in 循环返回的值都是数据结构的 键值名。遍历对象返回的对象的key值,遍历数组返回的数组的下标(key)。for … in 循环不仅可以遍历数字键名,还会遍历原型上的值和手动添加的其他键。for of对象就是键值value,数组就是数组的值,字符串就是字符。for of 循环用来获取一对键值对中的值,而 for in 获取的是 键名。

2024-03-16 07:30:00 1101 1

原创 2024金三银四react面试葵花宝典,欲练此功。。。

2024金三银四react面试必知,在 React 中,类组件和函数组件的生命周期函数有所不同。react各种hooks,react常用hooks,常考笔试题## 程序员的金三银四求职宝典

2024-03-11 17:02:54 1114

原创 nginx详解,配置http,https,负载均衡,反向代理,SMTP 代理步骤说明

Nginx 是一款高性能的开源 Web 服务器,同时也可以用作反向代理服务器、负载均衡器、HTTP 缓存、HTTPS 中继、以及作为邮件代理服务器等。

2024-03-11 15:09:41 1854

原创 关于前端性能优化,你做了哪些?

前端性能优化,面试必知,保证面试官满意的答案

2024-03-06 19:07:11 991

原创 爆肝整理万能sass框架:react18+webpack5+typescript+ant Design,框架在手,交付无忧!!!

爆肝整理万能sass框架:react18+webpack5+typescript+ant Design

2024-03-06 18:55:38 477

原创 vue3+webpack5+vue-i18n国际版官网,支持多国语言中英法等语言切换,暗黑明亮主题风格切换,多页面应用框架,从0-100实现详细步骤说明

vue3+webpack5+vue-i18n多国语言国际版官网,支持多国语言中英法等语言切换,暗黑明亮主题风格切换,多页面应用框架,从0-100实现详细步骤说明

2024-03-06 18:46:01 485

原创 next.js搭载ant Design框架,服务端渲染从0到1,开发个人简历,博客文章,技术网站

next.js搭载ant Design框架,服务端渲染从0到1,开发个人简历,博客文章,技术网站

2024-03-06 18:33:21 1567

原创 前端太卷了,不玩了,难道就你还不会写node.js全栈,赶紧学起来吧!!!!!

Express是一个轻量级且灵活的Node.js Web应用程序框架,它提供了一组简洁而强大的工具,帮助开发者快速构建Web应用。Express的核心理念是中间件,通过中间件可以处理HTTP请求、响应以及应用程序的逻辑。

2024-03-06 18:29:05 1459

原创 vue3+vite5+typescript+antDesign实战详解附代码,框架可以直接跑起来用,5分钟搞定一个自定义主题风格和登录权限的万能的SASS系统

vue3+vite5+typescript+antDesign实战详解附代码,框架可以直接跑起来用,5分钟搞定一个自定义主题风格和登录权限的万能的SASS系统

2024-03-06 17:08:13 1271

原创 别告诉我你还不造celery是干嘛的

消息队列:Celery使用消息队列来调度和分配任务。异步执行:任务可以异步执行,允许长时间运行的任务不阻塞主应用程序。分布式架构:支持多个Worker,任务可以分布在多个机器上执行,提高任务处理能力和容错能力。灵活的调度:支持定时和周期性任务调度。通过以上原理和示例,您可以了解Celery如何通过消息队列实现分布式、异步任务处理,提升应用的并发处理能力和实时性。Celery的优点。

2024-07-16 07:00:00 1433 1

原创 来聊聊Socket,WebSocket和MQTT的区别

特性Socket协议MQTT协议通信模型点对点通信发布/订阅适用场景实时通信、在线游戏、视频通话等物联网、传感器网络、智能家居等灵活性高中等实时性高中等复杂性高低扩展性差高依赖组件无需要Broker消息大小无限制有限制安全性需自行实现加密措施支持TLS,但配置复杂通过上述优缺点的分析,可以更好地理解Socket协议和MQTT协议各自的适用场景和选择依据。在需要高实时性和灵活性的点对点通信场景中,Socket是较好的选择。

2024-07-16 07:00:00 1287

原创 性能优化篇:用WebSocket替代传统的http轮循

WebSocket在需要高效实时通信的应用场景中,比传统的HTTP轮询具有明显的优势。它提供了低延迟、全双工通信、减少网络开销和高效资源利用等优点,使得客户端和服务器之间的数据交换更加高效和实时。因此,WebSocket是现代Web应用,尤其是那些需要实时数据传输的应用中的重要技术。所以,别再傻傻的还去用定时器开启http轮循了,技术升级一下吧!

2024-07-15 07:00:00 1209

原创 性能优化篇:SQL数据库查表速度优化

SQL数据库查询的性能优化是确保数据库能够快速响应和高效处理请求的关键。当然,以下是一些具体的SQL查询优化示例代码,涵盖了索引优化、查询优化、表设计优化等方面。

2024-07-14 07:00:00 1110

原创 vue中Promise.then,this.$nextTick 和 setTimeout 的执行优先级,以及nextTick 的内部实现原理

和都属于微任务,优先级较高。setTimeout属于宏任务,优先级较低。在同一个事件循环中,所有微任务执行完毕后才会执行宏任务。理解这些机制的差异可以帮助你更好地控制异步操作的执行顺序,确保在合适的时间点进行 DOM 操作或其他依赖更新的数据处理。:更适合在 Vue 的数据更新和 DOM 渲染之后执行回调。它保证了回调在 DOM 更新完成之后执行,因此非常适合需要操作更新后 DOM 的情况。setTimeout:更通用的异步执行方法。它不会等待 DOM 更新完成,只会在当前事件循环结束后执行回调。

2024-07-13 07:00:00 1285

原创 给后台写了一个优雅的自定义风格的数据日志上报页面

选择合适的主题:Highlight.js 提供了多种主题样式,你可以在Highlight.js 官方文档上查看和选择。首先安装highlight.js组件库。导入新的主题样式:根据选择的主题样式,如果是vue框架,在main.js中导入相应的 CSS 文件。例如,如果你选择了主题,修改main.js文件,确保main.js// 使用 atom-one-dark 主题new Vue({你可以在的样式部分添加自定义样式来覆盖默认的主题样式。例如,修改字体颜色、背景颜色。组件代码如下。

2024-07-12 07:00:00 815 6

原创 应对高并发请求:服务器性能压力的解决方案

在应对高并发请求时,除了负载均衡和限流,还有许多其他方法可以帮助提升服务器性能。这些方法包括缓存、CDN、数据库优化和异步处理。通过合理组合这些技术,可以有效地减轻服务器压力,提升系统的稳定性和响应速度。希望本文提供的示例代码能为实际应用提供有价值的参考。

2024-07-11 07:00:00 1062

原创 用three.js+echarts给公司写了一个站点数据大屏系统经验总结

这里我用了第三方插件:动态数字翻牌器,只要有数据变化,就会实时看到动态增长的效果首先要在框架中安装,并在项目入口文件中引入new Vue({router,store,})

2024-05-23 08:00:00 1431

原创 编程语言不同如何快速开发python项目,Celery处理大规模的异步任务

由于本人之前是写node.js开发后端项目的,现在要接手同事的python项目,别急,问题不大,语言不是障碍。读完这篇文章,让你快速上手python。

2024-05-22 08:00:00 1344 1

原创 给运营开发了一个支持富文本编辑的动态网页发布系统,然后我每天都按时下班了!

大家好,我是一名全栈开发工程师,随着近期公司的机器人项目上线,pr部门一次性发过来中英法三国语言的百十篇word格式的动态新闻素材包(包括:文字,图片,视频,超链接),让我把每篇文章都务必更新到公司的两大官网和APP端(ios,andriod)上,这工作量一听是不是带把自己干到ICU了,要命的是,刚画完静态页面,然后负责法文网站翻译的同事说:不好意思,有个法语文章的一个法语单词用的不太优雅,能不能帮我改下?负责英文网站翻译的同事说:这段翻译,老板不喜欢,能不能帮我改一下?

2024-05-21 08:00:00 446

原创 webpack打包优化详解

先简单总结一下,优化Webpack打包可以通过多种方式来提高性能和减小文件大小。:将代码拆分成多个小块,使得在加载页面时只加载必要的代码。Webpack提供了多种代码分割的方法,如使用import()函数、插件等。:将不需要立即加载的模块延迟加载,提高页面初次加载速度。通常与代码分割一起使用。:使用Webpack的或等插件来压缩和混淆JavaScript代码,减小文件大小。:使用url-loader或来处理图片,可以将小图片转换为Data URL,或者通过图片压缩工具来减小图片大小。:通过。

2024-05-19 08:00:00 1331

原创 前端优化图片加载速度的技术详解

随着现代网页内容越来越丰富,图片成为了不可或缺的一部分。然而,大量或高分辨率图片的加载常常会导致网页性能下降,用户体验变差。本文将详细介绍几种前端优化图片加载速度的技术,并提供相应的代码示例。

2024-05-18 08:00:00 1562

原创 Ajax、Axios和Fetch的用法和区别,撤回请求,防抖节流,针对处理高频率请求的场景如何处理?

在现代JavaScript开发中,用于进行HTTP请求的三种主要方式是Ajax、Axios和Fetch。这三种方式各有优缺点,并且适用于不同的场景。在合适的业务场景下使用,以下是它们的区别和使用举例。并且实现撤回或取消请求,减少不必要的重复请求,在同时有高频率大量请求时,放入请求队列,以及前端的防抖或者节流,提高前端性能优化。Ajax(Asynchronous JavaScript and XML)是一种使用JavaScript和XML进行异步网页更新的技术。尽管其名称中包含XML,但它可以处理多种数据格式

2024-05-17 18:08:44 1214

原创 为什么有能力有想法的人反而更容易离职?职场的混子却容易干的长久呢?

有这样一位程序员,他工作认真负责,具有很高的责任心,踏实肯干,能力强而且思维活跃,经常提出自己的想法和建议。随着时间的推移,他感到越来越委屈,身心俱疲,最终选择了离职。对于打工人来说,一定要避免自己陷入精神内耗的状态中,一定不要被PUA,相信自己,我们只是拿钱来干活的,放平心态,千万不要过度内耗,保持一个平稳的心态,有钱就赚,别付出太多真情实感,职场是讲究利益的地方。,这里新人不妨向老人照镜子学习,很多新人不懂的东西,也许是你还没经历过老人所经历的事情,毕竟大家都曾年轻过,有过热血,为职场付出过青春。

2024-04-20 15:59:45 1107

原创 H5代码video标签引入视频在浏览器的兼容性问题解决办法

首先,请确保您的文件路径正确。其次,考虑到在谷歌浏览器中视频可以正常播放,但在其他浏览器中出现问题,这可能是由于不同浏览器对视频编解码器支持的差异导致的。H5视频代码在谷歌浏览器正常但是在火狐浏览器和版本较低的浏览器或者IE浏览器却无法观看视频,只能看到音频,是什么原因?您可以尝试提供不同格式的视频文件来兼容不同的浏览器。另外,请确保您的浏览器没有屏蔽视频播放,也确保您的网络连接稳定。这通常是一个很好的做法,因为不同的浏览器支持不同的视频格式。元素来提供视频文件的不同来源。格式的视频作为备用选项。

2024-04-16 17:51:19 1158

原创 LeetCode刷题笔记

一定是爬了1或2个台阶才上到了n级台阶的,所以爬到n级台阶的爬法数是爬到(n-1)级台阶爬法数和爬到(n-2)级台阶爬法数的和,这就有点像斐波那契数列的公式一样。假设有0级台阶、1阶台阶、2阶台阶。n级台阶,所以设置一个长度为(n+1)的数组。如果最终爬到了n级台阶,那么在这之前的一步,根据题意,

2024-04-05 07:30:00 291

原创 了解next.js框架特点,以及总结Next.js 常用的api和用法

Next.js 是一个流行的 React 框架,它提供了很多开箱即用的功能,如服务器渲染、静态导出、代码拆分等,让开发者可以更轻松地构建 React 应用。下面是对 Next.js 的深度解析,以及附带的代码实例。

2024-04-04 07:30:00 2252

原创 Generator 函数的原理和应用

Generator 函数是 ES6 引入的一种特殊的函数类型,它允许在函数执行过程中暂停并在之后恢复执行,这种暂停和恢复的能力使得编写异步代码更加简洁和可读。Generator 函数通过使用function*关键字来定义,内部使用yield关键字来暂停函数执行并返回一个值。

2024-04-01 07:30:00 480

原创 一文总结vue和react的区别

Vue.js 和 React.js 都是流行的 JavaScript 前端框架,用于构建用户界面。

2024-03-31 07:30:00 1190

原创 vue3 中 ref和reactive、shallowRef和shallowReactive,toRaw 和 markRaw的区别

在 Vue 3 中,`ref`、`reactive`、`shallowRef`、`shallowReactive` 是用于创建响应式数据的方法,而 `toRaw` 和 `markRaw` 则是用于处理响应式数据的辅助函数。让我分别解释它们的区别:

2024-03-30 07:30:00 743

原创 程序媛28岁前畅游中国是什么体验?

一名95后女程序员畅游中国的故事,由于我本人在掘金写的文章里面晒了很多在各个景点的实拍风景图,没办法直接复制过来。链接:https://juejin.cn/post/7351301965034586152。商业转载请联系作者获得授权,非商业转载请注明出处。大家可以阅读我在掘金写的文章。作者:为了WLB努力。

2024-03-29 14:23:41 673

原创 MVVM,MVP,MVC,Flux,Redux,MobX等前端架构模式汇总

MVVM更加强调数据驱动视图,通过数据绑定实现视图和模型之间的自动同步,更适用于数据驱动型的应用场景。MVP更加强调解耦视图和模型,通过主持人来协调视图和模型之间的交互,更适用于 UI 控制和逻辑分层更为严格的应用场景。综上所述,MVVM 和 MVP 是两种不同的前端架构模式,每种模式都有其独特的优点和适用场景。开发者可以根据项目需求和特点选择合适的架构模式。除了 MVVM 和 MVP,还有一种常见的前端架构模式是 MVC(Model-View-Controller)。

2024-03-27 07:30:00 1030

原创 闭包常见笔试题

MDN:函数被引用包围,这样的组合就是闭包。闭包可以在一个内层函数中访问到外层函数的作用域。必包原理:闭包就是有权访问另一个函数作用域中内部变量或数据的函数。核心原理:将闭包所需的数据,都存储到堆上,堆数据是不会随着函数调用结束而结束的。保存:闭包将局部变量的生命周期拉长,不会随着函数调用结束而结束。保护:不会成为全局变量,也不会收到外部影响。缺点:数据被闭包对象closure引用,导致数据引用复杂,容易发生内存泄漏问题。!!!

2024-03-26 07:30:00 952

原创 js必考知识点,原型与原型链,继承的几种方式

js必考知识点,原型与原型链,继承的几种方式

2024-03-25 07:30:00 377

原创 promise面试必刷笔试题

Promise 是 JavaScript 中一种用于处理异步操作的对象,它可以让我们更优雅地处理异步代码,并解决了回调地狱(callback hell)的问题。Promise 是一个代表了异步操作最终完成或失败的对象,并可以获取异步操作的结果。:Promise 有三种状态:pending(进行中)、fulfilled(已成功)和rejected(已失败)。初始状态是 pending,当异步操作完成后,可以变为 fulfilled(成功)或 rejected(失败),一旦状态发生变化,就不可再改变。

2024-03-24 07:30:00 1044

个人技术网站,用服务端渲染next.js框架实现,多页面应用,利于seo,搭配antDesign组件库

个人技术网站代码,用服务端渲染next.js框架实现, 多页面应用,利于seo检索,搭配antDesign组件库,快速开发页面 node版本v18.19.0 (npm v10.2.3) npm install npm run dev ant组件库-详情阅读 https://juejin.cn/post/7313911715854598184 自动读取指定目录的.md文件, 自动生成技术文章, 快速开启你的私人技术博客吧

2024-03-07

爆肝整理万能SASS框架:react18+webpack5+typescript+ant Design,框架在手,交付无忧!!!

来活了,要求一周时间内快速给xxx业务开发一个sass系统平台,要求有角色权限控制,推荐模块,各种业务内容模块,莫慌,直接上代码!!! 1.系统框架配置如下: react18框架 webpack5打包 typescript4静态检查 antDesign4组件库 eslint代码规范 react-router路由 2.项目结构详细说明 webpack.dev.js:为开发环境 webpack.prod.js:为生产环境 webpack.config.js:为公共的打包配置 .eslintrc.js:代码规范 .tsconfig.json:typescript静态检查 src 业务代码 public 下为html文件 接口请求用axios封装 支持pdf文件下载 角色权限控制写在src/layout/index.tsx文件中 封装的公共组件在src/component 图片在src/images 业务代码写在src/page中 样式写在src/layout.scss 工具包写在utils中 入口文件在src/index.index.tsx 路由文件在src/router中 ———————

2024-03-07

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除