0%

简介

Cypress 是一个专门用于前端测试的开源 JavaScript 框架,其代码仓库地址为
https://github.com/cypress-io/cypress 。它为开发人员提供了一套简洁而强大的 API,能够轻松地对 Web 应用程序进行端到端(End-to-End)、集成和单元测试。

Cypress 具有诸多特色功能:

  • 能实时重新加载和调试:在测试过程中,开发者可以实时看到测试代码的执行情况,当代码发生改变时,Cypress 会自动重新加载,大大提高了开发效率。
  • 测试运行速度快:采用了独特的架构,能够并行执行多个测试用例,减少了测试的总时间。
  • 提供了丰富的断言库:开发者可以方便地对页面元素的状态、属性等进行验证。
  • 支持截图和视频录制功能:当测试失败时,开发者可以通过截图和视频来快速定位问题。

使用

阅读全文 »

新的 JavaScript Temporal API 已陆续在浏览器实验版本中发布,这对 Web 开发人员很利好,因为其大大简化了 JavaScript 中日期和时间的处理。

image-20250213173447113

至此,依赖于调度 (Scheduling)、国际化 (Internationalization) 或时间敏感数据的应用程序将能够使用 Temporal 内置功能来获得高效、精确和一致的日期、时间和日历等数据。

虽然 Temporal API 距离稳定的跨浏览器支持还有很长的路要走,而且可能随时会发生变化,但至少前端开发者可以开始逐步了解和认识强大的 Temporal API 了。

为什么强烈需要 Temporal API

阅读全文 »

尤雨溪推荐的全新Vue动画库!

在很长一段时间里,Vue 的生态中缺少一个好用的动画库。前段时间,热门 React 动画库 Motion 宣布进行拆分,其不再局限于 React 项目,而提供了原生 JavaScript API,使得所有 JavaScript 项目都能轻松使用。

unovue 基于 Motion 开发了 Motion for Vue 动画库,专门用于 Vue 项目,这个项目也得到了 Vue 作者尤雨溪的推荐。

https://github.com/unovue/motion-vue

image-20250211170630150

阅读全文 »

SSH2-SFTP-Client:简化SFTP文件传输的Node.js插件

在现代开发环境中,文件传输是一个不可或缺的环节,特别是在需要在不同服务器之间同步数据或上传下载文件时。SSH(安全外壳协议)和SFTP(SSH文件传输协议)因其安全性和灵活性而广受欢迎。对于Node.js开发者来说,ssh2-sftp-client是一个强大的插件,能够极大地简化SFTP操作。本文将详细介绍ssh2-sftp-client的功能、安装方法以及如何使用它进行文件传输。

一、概述

ssh2-sftp-client是一个基于ssh2库的Node.js模块,它提供了一个高级的API,使得通过SFTP进行文件上传、下载、删除、列出等操作变得简单直观。该插件封装了底层的SFTP细节,开发者无需深入了解SFTP协议的具体实现,即可快速实现文件传输功能。

二、安装

阅读全文 »

图片或文件批量下载,那么假如我一次性下载几十个,如何去控制并发请求。

利用Promise模拟任务队列,从而实现请求池效果。

众所周知,浏览器发起的请求最大并发数量一般都是6~8个,这是因为浏览器会限制同一域名下的并发请求数量,以避免对服务器造成过大的压力。

首先让我们来模拟大量请求的场景640

一次性并发上百个请求,要是配置低一点,又或者带宽不够的服务器,直接宕机都有可能,所以我们前端这边是需要控制的并发数量去为服务器排忧解难。

阅读全文 »

在当今数字化时代,3D技术在各个领域的应用日益广泛,从虚拟现实和游戏开发,到建筑设计和科学可视化,3D技术为我们提供了新的视角和交互方式。WebGL作为一种基于浏览器的图形渲染技术,允许开发者在网页中直接创建复杂的3D图形,而无需插件。Three.js作为一个强大的JavaScript库,简化了WebGL的使用,使得3D建模和动画变得更加直观和高效。

本文将带领大家深入了解WebGL和Three.js的基础知识,并结合3D机房的实际应用,展示如何创建交互式的3D场景。无论你是初学者还是有一定经验的开发者,本次培训都将为你提供宝贵的知识和技能,帮助你在3D技术领域更上一层楼。

Webgl

对于网站而言,web 3d 技术应用,实现了企业网站的三维呈现,让企业形象更加直观更立体的展现给客户,打破传统平面展示模式。WebGL,是一项用来在网页上绘制和渲染复杂三维图形,并允许用户与之进行交互的技术。WebGL是内嵌在浏览器中的,不必安装插件和库就能直接使用。尽管从功能上而言原生 WebGL API 能够知足咱们任意场景的开发,可是其开发和学习的成本极其昂贵。对于 WebGL 的初学者而言是极度不友好的,对于开发者而言须要必定的数学基础熟悉矩阵的运算,同时也要有空间几何的概念熟悉 3D 物体的空间分布。场景的光照,纹理等的设计也都须要对颜色的配置有本身的看法。因此为了给初学者下降难度,下面介绍一些 WebGL 开发的经常使用框架。

  1. Three.js
阅读全文 »

很多人会局限于把requestAnimationFrame应用于一些纯动画相关的需求上,但其实在前端很多业务场景下requestAnimationFrame都能用于性能优化,下面将细说一下requestAnimationFrame的具体用法和几种应用场景

requestAnimationFrame作用与用法

requestAnimationFrame简述

640

基本示例
阅读全文 »

Web Worker是Web浏览器提供的一种在后台线程中运行JavaScript的功能。它独立于主线程运行,可以执行计算密集型或长时间运行的任务,而不会阻塞页面的渲染和交互。通过将大文件切片上传的逻辑放在Web Worker中执行,我们可以充分利用浏览器的多线程能力,提高上传速度,并保持页面的流畅运行。

基于Vue的基础用法

在Vue项目中配置webpack来使用web-worker涉及几个关键步骤。这主要涉及到处理worker文件的加载,确保它们被正确地打包和引用。以下是一个基本的配置过程:

1.安装worker-loader

npm install --save-dev worker-loader

阅读全文 »