SF
南玖的前端blog
南玖的前端blog
注册登录
关注博客
注册登录
主页
关于
RSS
深入理解Base64编码原理
南玖
3 月 18 日
阅读 4 分钟
330
前言上篇文章有涉及到Base64编码的内容,今天我们再来详细了解一下Base64的编码原理以及应用场景。通过这篇文章你能够学习到:什么是Base64,为什么需要Base64?Base64的编码原理Base64的应用场景什么是Base64?Base64是一种用于传输8bit字节数据的编码方式,Base64 的字符集包含 64 个字符(A-Z、a-z、0-9、+、/)以及...
深入了解Vite:依赖预构建原理
南玖
2 月 17 日
阅读 3 分钟
1k
前面我们有提到Vite在开发阶段,提倡的是一个no-bundle的理念,不必与webpack那样需要先将整个项目进行打包构建。但是no-bundle的理念只适合源代码部分(我们自己写的代码),vite会将项目中的所有模块分为依赖与源码两部分。
小程序如何实现跨页面通信
南玖
2 月 13 日
阅读 7 分钟
1.2k
最近有很多同学问,小程序里面如何进行跨页面通信。看了下之前的老代码,基本都是基于onShow或者localStorage。虽然可以实现,但是并不怎么优雅。
Base64编码的“暗坑”:解密失败?可能是这些原因!
南玖
2 月 10 日
阅读 4 分钟
1.2k
最近开发过程中遇到了关于使用base64加密传输遇到的神奇问题。需求就是用户的id在链接上露出时需要加密处理,于是后端把下发的用户id改成了base64加密处理后下发了,前端只需要把加密后的用户id原样传给后端就行。就是这个看似简单的流程,前端啥也没干只是原样透传,但后端有概率拿到的用户id不对。
深入理解Vue3:style中的响应式变量如何工作?
南玖
2024-12-03
阅读 5 分钟
869
在很多业务场景中,我们的style样式可能会根据业务逻辑的变化而变化,这个时候大家最容易想到的方案就是多写几个class类,根据不同场景应用不同的类,比如这样:
渐进式图片加载:提升前端用户体验的艺术
南玖
2024-11-04
阅读 4 分钟
878
关于前端的性能及体验问题,图片的加载绝对是重中之重,尤其是在一些有着许多大图的页面,在网络不稳定或稍慢的时候,我们经常能够看到页面中图片的位置是一片空白,等图片加载完成才开始慢慢渲染,在这段时间对用户的体验其实是非常不友好的。
开发自定义Taro插件解决跨平台难题
南玖
2024-09-24
阅读 4 分钟
4.7k
在Taro项目开发中,难免会遇到需要混合编译的场景,一般来讲Taro可以使用原生模块、原生项目也可以使用Taro的模块内容。官方也确实说了Taro 支持使用小程序原生的页面、组件和插件。
TS中关于void类型的奇怪现象
南玖
2024-09-05
阅读 4 分钟
2.1k
并且它一般用于给函数返回值声明类型 ,虽然也可以把一个变量的类型声明为void,但我们一般不会这么干,因为没有意义,为什么这么说呢?在下面的例子中来解答这个问题
Taro4.0支持使用Vite构建
南玖
2024-07-28
阅读 3 分钟
2.6k
前言早在Taro3.5的版本发布时,Taro团队就表示将会在接下来的3.6版本落地对Vite的支持。但在3.6的版本中根本就没看到Vite的身影,随着社区对Vite的呼声越来越高,终于在Taro4.0beta版本中支持了这一功能!目前 Taro 在 Vite 编译系统适配方面,优先支持了小程序、H5 和鸿蒙三端。但仔细一想🤔,H5支持使用Vite编译可以理...
Vite本地构建:手写核心原理
南玖
2024-06-30
阅读 6 分钟
565
接上篇文章,我们了解到vite的本地构建原理主要是:启动一个 connect 服务器拦截由浏览器请求 ESM的请求。通过请求的路径找到目录下对应的文件做一下编译最终以 ESM的格式返回给浏览器。
浅析Vite本地构建原理
南玖
2024-06-11
阅读 5 分钟
932
对于webpack打包的核心流程是通过分析JS文件中引用关系,通过递归得到整个项目的依赖关系,并且对于非JS类型的资源,通过调用对应的loader将其打包编译生成JS 代码,最后再启动开发服务器。
【性能监控】如何有效监测网页静态资源大小?
南玖
2024-04-24
阅读 4 分钟
1.1k
作为前端人员肯定经常遇到这样的场景:需求刚上线,产品拿着手机来找你,为什么页面打开这么慢呀,心想自己开发的时候也有注意性能问题呀,不可能会这么夸张。那没办法只能排查下是哪一块影响了页面的整体性能,打开浏览器控制台一看,页面上的这些配图每张都非常大,心想这些配图都这么大,页面怎么快,那么我们有没有...
移动端安全区域适配方案
南玖
2024-04-16
阅读 3 分钟
2.1k
自从苹果推出了惊艳的iPhone X,智能手机界就正式步入了全面屏的新纪元。然而,这一革新也带来了一个特别的问题——那就是屏幕顶部的“刘海”和底部的“黑条”区域。这些区域犹如手机的“神秘面纱”,遮挡了一部分屏幕,给开发者带来了新的挑战。
如何巧妙应对iOS键盘难题?
南玖
2024-04-11
阅读 5 分钟
2.9k
写过移动端的同学或多或少都遇到过软键盘带来的各种各样的问题,最典型的就是输入框被软键盘遮挡、fixed元素失效等问题,并且这些问题在iOS上的表现让人难以接受。
关于小程序如何做到强制更新
南玖
2024-03-14
阅读 3 分钟
3.9k
在小程序的日常迭代中,有一些场景我们可能需要在小程序发布后,用户能够马上感知并更新,比如上线新活动、修复高危漏洞等,如果用户因为各种原因未能及时更新小程序,这就可能导致一些功能无法正常使用或者存在安全隐患,因此,实现小程序的强制更新功能就显得尤为重要。本文将探讨小程序如何做到强制更新,以确保用户...
JavaScript 最新动态:2024 年新功能
南玖
2024-03-07
阅读 4 分钟
3.7k
随着 Web 技术的日新月异,JavaScript 也在不断地吸收新的特性和技术,以满足日益复杂和多样化的开发需求。在 2024 年,JavaScript 迎来了一系列令人瞩目的新功能,这些功能不仅提升了开发者的效率,也极大地丰富了 Web 应用的表现力和交互性。
使用原生 cookieStore 方法,让 Cookie 操作更简单
南玖
2024-02-27
阅读 7 分钟
3.9k
对于前端来讲,我们在操作cookie时往往都是基于document.cookie,但它有一个缺点就是操作复杂,它并没有像localStorage那样提供一些get或set等方法供我们使用。对与cookie的操作一切都是基于字符串来进行的。为了让cookie的操作更简便, Chrome87率先引入了cookieStore方法。
团队协作如何确保项目Node版本的一致性?
南玖
2024-02-24
阅读 1 分钟
2.3k
想必大家在工作过程中都遇到过node版本带来的各种各样的问题,对于团队协作项目,你不能保证所有人的本地node版本都相同,所以在项目文档中往往会写上以下内容:
揭开空白网页背景色的神秘面纱
南玖
2024-01-30
阅读 2 分钟
2k
前言一个看似简单实则有坑的问题:空白网页的背景色是什么?大家是不是都会认为是白色,但事实并非如此,有时候我们眼睛看到的也不一定是真的🧐页面根元素背景色比如下面这段代码: {代码...} 这样我们能够看到整个页面都变成蓝色看到这里可能有人会觉得是body填充了整个视图,但稍微有经验的同学知道,body的高度在没定...
基于taro搭建小程序多项目框架
南玖
2024-01-22
阅读 4 分钟
3.1k
从字面意思上理解:该框架可以用来同时管理多个小程序,并且可以抽离公用组件或业务逻辑供各个小程序使用。当你工作中面临这种同时维护多个小程序的业务场景时,可以考虑使用这种模式。灵感来自webpack的多项目打包构建
国庆微信头像DIY:轻松打造个性化头像
南玖
2023-09-24
阅读 7 分钟
1.9k
前言国庆节马上要到了,今天就教你如何从0到1使用canvas生成国庆风微信头像。本文包含以下内容:vue3项目搭建,需求分析canvas合成图片原理github自动化部署开发过程遇到的问题及解决方案文末附源码及在线体验地址~搭建项目,分析需求项目的话就直接使用脚手架生成一个 Vue3 + TS项目 {代码...} 为了方便,使用了Element...
纯前端也可以访问文件系统!
南玖
2023-09-10
阅读 4 分钟
10k
周末逛github的时候,发现我们只需要在github域名上加上1s他就能够打开一个vscode窗口来阅读代码,比起在github仓库中查看更加方便
【NestJS系列】连接数据库及优雅地处理响应
南玖
2023-08-29
阅读 7 分钟
2k
TypeORM 是一个ORM框架,它可以运行在 NodeJS、Browser、Cordova、PhoneGap、Ionic、React Native、Expo 和 Electron 平台上,可以与 TypeScript 和 JavaScript一起使用。 它的目标是始终支持最新的 JavaScript 特性并提供额外的特性以帮助你开发任何使用数据库的(不管是只有几张表的小型应用还是拥有多数据库的大型企...
【NestJS系列】核心概念:Middleware中间件
南玖
2023-08-28
阅读 3 分钟
1.8k
前言用过express与koa的同学,对中间件这个概念应该非常熟悉了,中间件可以拿到Request、Response对象和next函数.一般来讲中间件有以下作用:执行任何代码对请求与响应拦截并改造结束request-response周期通过next()调用下一个中间件如果当前中间件没有结束当前request-response周期,必须调用next()函数,否则请求会处...
【NestJS系列】核心概念:Module模块
南玖
2023-08-24
阅读 5 分钟
4.8k
模块指的是使用@Module装饰器修饰的类,每个应用程序至少有一个模块,即根模块。根模块是Nest用于构建应用程序的起点,理论上Nest程序可能只有根模块,但在大多数情况下是存在多个模块的,每个模块各自封装一组相关的功能。
Docker数据持久化与数据共享
南玖
2023-08-17
阅读 6 分钟
1.5k
上篇文章的最后我们使用Docker部署了一个纯前端项目,但还有一个很重要的问题就是容器中产生的数据(比如log文件),容器一旦被删除,容器内的所有数据也就没有了,为了避免这个问题我们可以将数据存储到容器之外(比如宿主机),这样即使删除容器也不会丢失数据。一旦容器故障,我们可以重新创建一个容器,将数据挂载到...
Docker从入门到部署项目
南玖
2023-08-14
阅读 5 分钟
1.4k
Docker是一个开源的应用容器引擎,它是基于Go语言并遵从Apache2.0协议开源。Docker可以让开发者打包他们的应用以及依赖包到一个轻量级、可移植的容器中,然后发布到任何流行的linux机器上,也可以实现虚拟化。通过容器可以实现方便快速并且与平台解耦的自动化部署方式,无论你部署时的环境如何,容器中的应用程序都会运...
关于package-lock.json
南玖
2023-08-10
阅读 8 分钟
6.2k
上篇文章我们了解了package.json,一般与它同时出现的还有一个package-lock.json,这两者又有什么关系呢?下面一起来了解吧。
熟悉又陌生的package.json
南玖
2023-08-07
阅读 7 分钟
1.2k
随着前端的不断发展,package.json可谓是在前端项目中无处不在,它不仅在项目根目录会有,而且在 node_modules 中也存在。那么这个文件到底是干嘛的,又有什么作用?很多人对它的认识是不是只停留在dependencies、devDependencies项目依赖列表,或者是script项目的各种脚本指令等,实际上它能做的事情远不止这些。
你不知道的 HTTP Referer
南玖
2023-07-27
阅读 4 分钟
4.7k
上周突然发现自己的自己站点的图片全都403了,之前还是好好的,图片咋就全都访问不了呢?由于我每次发文章都是先发了掘金,然后再从掘金拷贝到我自己的站点,这样我就不用在自己的站点去上传图片了,非常方便。
1
(current)
2
下一页
1
(current)
下一页