天行无忌_社区达人页

2022年06月

• 06.29 14:22:13
  发表了文章 2022-06-29 14:22:13

  NodeJs 全栈创建多文件断点续传

  文件上传，算是项目开发中比较常见的需求，本文将展示如何构建一个多文件断点续传组件，可以同时处理多个文件，并可以在出现异常或者网络中断的情况下恢复上传，可以手动暂停和恢复文件的上传。文章内容涉及前端和后端，算是一个小型的全栈项目，项目将使用 NodeJs、Express、Busboy 和 XMLHttpRequest，并使用自己开发的脚手架 generator-norm 来构建项目。

  
• 06.29 14:19:48
  发表了文章 2022-06-29 14:19:48

  Ember.js 项目开发之 Ember Data

  Ember.js 是一个基于MVVM模型的开源框架，该框架主要用于创建复杂的多页面应用程序。它最大的特点是：持续推出最新的特性，并不会丢弃任何旧功能。

  
• 06.29 14:16:59
  发表了文章 2022-06-29 14:16:59

  JavaScript 中的文档对象模型 DOM

  DOM，即文档对象模型，前端开发工程师必学的基础知识，趁着假期，顺便复习一下。在本文将介绍如何在 HTML 文档中选择元素、如何创建元素、如何更改内联 CSS 样式以及如何监听事件。

  
• 06.29 14:14:06
  发表了文章 2022-06-29 14:14:06

  每天学习使用代码片段（八）

  在项目开发过程中，总觉得有更好的方式来组织代码，通过代码片段，间接的学习一些代码组织技巧。阅读开源代码，是开阔编码思维最快捷的方式，如果觉得内容能够带来点帮助，可以查看专栏《碎片时间学习JavaScript代码》其他内容，又或者有用到的需求片段，不妨在留言区留言。
• 06.29 14:11:41
  发表了文章 2022-06-29 14:11:41

  细说包管理器yarn和npm

  在过去，一个简单的文本编辑器就足以让开发人员创建和管理大部分项目。但从那以后，WEB发生了翻天覆地的变化，如今，即使是一个相当简单的项目，通常也会有成百上千个带有复杂嵌套依赖关系的脚本，如果没有自动化工具，这些脚本根本无法有序的管理，这时就需要包管理器。
• 06.29 14:10:07
  发表了文章 2022-06-29 14:10:07

  每天学习 10 个实用JavaScript代码片段（七）

  每天学习10个实用JavaScript代码片段，加深对 JavaScript 语法的理解，积累代码优化经验，新的内容来了，学习阅读代码是提高编码技能的最佳方式。如果觉得内容能够带来点帮助，可以查看专栏《碎片时间学习JavaScript代码》其他内容，又或者有用到的需求片段，不妨在留言区留言。
• 06.29 14:08:52
  发表了文章 2022-06-29 14:08:52

  CSS 轻松制作 SVG 动画

  如果从未在前端使用过 SVG，那么就错过了很多改善性体验，如果不知道如何使用 SVG 制作动画，那么将错过更多。本文开始制作第一个 SVG 图形，为其添加动画。

  
• 06.29 14:07:26
  发表了文章 2022-06-29 14:07:26

  JavaScript中6 个reduce()实例

  reduce 方法在数组的每个元素上执行提供的回调函数迭代器。它传入前一个元素计算的返回值，结果是单个值，它是在数组的所有元素上运行迭代器的结果。
• 06.29 14:06:15
  发表了文章 2022-06-29 14:06:15

  CSS交互动画指南之transition

  WEB 动画世界已经变成了一个庞大的工具和技术丛林，像 GSAP 和 Framer Motion 以及 React Spring 这样的库如雨后春笋般涌现，帮助WEB项目开发向 DOM 添加动作。

  
• 06.29 14:02:02
  发表了文章 2022-06-29 14:02:02

  CSS交互动画指南之keyframes

  过去 WEB 需要实现交互动画效果是使用 flash 、javascript、Gif，近年来随着 flash 的淘汰，javascript 和 CSS 功能的增强，使得现代 WEB 应用的交互越来越丰富。借此总结一下 CSS 交互动画实现的基础，关键的知识点是 keyframes ，文章涉及的代码示例效果可以点击查看动画效果。
• 06.29 14:01:03
  发表了文章 2022-06-29 14:01:03

  9 个前端性能优化的最佳实践

  现代互联网时代，打开一个Web平台，是留下还是离开，只需要 1 分钟，因此前端的性能优化至关重要。
• 06.29 14:00:07
  发表了文章 2022-06-29 14:00:07

  移动WEB开发会用到的 5 个API

  作为开发人员，经常使用 Web API 来轻松实现复杂的功能，或者创建它们来抽象复杂性。Web API 允许服务之间进行对话，分享信息到朋友圈或显示地图等操作。
• 06.29 11:12:06
  发表了文章 2022-06-29 11:12:06

  WEB 剪切板操作navigator.clipboard的使用

  浏览器允许 JavaScript 脚本读写剪贴板，自动复制或粘贴内容，而这一切都是通过 navigator clipboard 的API来实现的。剪贴板可以用于存储数据并在应用程序内部或应用程序之间使用的临时空间。这些操作的 API 都是异步操作并返回一个 promise。
• 06.29 11:10:58
  发表了文章 2022-06-29 11:10:58

  如何 PWA 构建现代离线应用程序

  渐进式 Web 应用程序 (PWA) 可能是现代移动应用程序开发的主流技术之一。这个技术工具结合了本地应用程序和web应用程序的功能。使用现代api来提供可靠性和可安装性，同时使用单一代码库访问任何人、任何地点、任何设备。PWA 在web开发中正在兴起，大大小小的公司都在利用这一强大的技术。本文将介绍PWA及通过代码开始一个基本的应用。

  
• 06.29 11:09:36
  发表了文章 2022-06-29 11:09:36

  ServiceWorker工作原理、生命周期和使用场景

  service worker 是现代web开发的关键部分，在最近几年获得了关注，这都要归功于 PWA（渐进式 Web 应用程序） 的流行。service worker 通过向典型的 Web 应用程序添加后台同步、离线渲染和推送通知等功能，缩小了本机应用程序和 Web 应用程序之间的差距，主要任务之一是充当代理。

  
• 06.29 11:03:35
  发表了文章 2022-06-29 11:03:35

  QUIC 简介及 NodeJs 简单示例

  QUIC协议是一个新的通讯协议，基于 UDP 的传输协议并希望最终取代所有基于TCP的HTTP请求。熟悉 UDP 的人都应该清楚为什么要使用 QUIC。UDP 是的特点是不可靠、数据包经常丢失、重新排序、重复等等。UDP 不包括任何更高级别协议（如 HTTP）严格要求的 TCP 的可靠性和顺序保证，这就是 QUIC 的用武之地。

  
• 06.29 11:01:35
  发表了文章 2022-06-29 11:01:35

  【布道API】关于 API 分页

  随着消费者期望的提高，API 性能从未像今天这样重要。众所周知，如果网页加载时间超过 3 秒，超过半数的网络用户会放弃继续浏览网页。
• 06.29 11:00:27
  发表了文章 2022-06-29 11:00:27

  Promise.race() 原理解析及使用指南

  Promise 对象是 ECMAScript 6 中新增的对象，主要将 JavaScript 中的异步处理对象和处理规则进行了规范化。前面介绍了《Promise.any() 原理解析及使用指南》、《Promise.all() 原理解析及使用指南》和《Promise.allSettled() 原理解析及使用指南》

  
• 06.29 10:58:09
  发表了文章 2022-06-29 10:58:09

  Promise.allSettled() 原理解析及使用指南

  Promise 对象是ECMAScript 6中新增的对象，主要将 JavaScript 中的异步处理对象和处理规则进行了规范化。前面介绍了《Promise.any() 原理解析及使用指南》和《Promise.all() 原理解析及使用指南》，本文继续来介绍 Promise 另一个方法 Promise.allSettled(promises) ，返回一个在所有给定的 promise 都已经 fulfilled 或 rejected 后的 promise ，并带有一个对象数组，每个对象表示对应的promise 结果。

  
• 06.28 22:08:21
  发表了文章 2022-06-28 22:08:21

  Promise.all() 原理解析及使用指南

  Promise 对象是ECMAScript 6中新增的对象，主要将 JavaScript 中的异步处理对象和处理规则进行了规范化。前面介绍了《Promise.any() 原理解析及使用指南》，本文来介绍另一个方法 Promise.all(promises) ，能够一次并行处理多个 promise，并且只返回一个 promise 实例， 那个输入的所有 promise 的 resolve 回调的结果是一个数组。

  
• 06.28 22:06:46
  发表了文章 2022-06-28 22:06:46

  Promise.any() 原理解析及使用指南

  Promise.any(promises) 是 ES2021 新增的特性，它能够并行运行 promise，并解析为 promises 列表中第一个成功解析的 promise 的值。需要注意的是 Promise.any() 方法依然是实验性的，尚未被所有的浏览器完全支持。

  
• 06.28 22:05:00
  发表了文章 2022-06-28 22:05:00

  【HTML5游戏】从敲打空格键开始

  从头开始创建令人印象深刻且引人入胜的跨平台游戏，本教程将学习如何剖析制作成功游戏的元素，以及如何开发游戏设计，循环和用户输入、动画、地图、碰撞检测和AI、数学、游戏物理等方面的实践技能。

  
• 06.28 22:02:56
  发表了文章 2022-06-28 22:02:56

  PM2实用指南及容器Docker部署

  Node.js 默认单进程运行，对于32位系统最高可以使用 512MB 内存，对于64位最高可以使用 1GB 内存。对于多核CPU的计算机来说，这样做效率很低，因为只有一个核在运行，其他核都在闲置，pm2 利用的 node 原生的 cluster 模块可以顺利解决该问题。

  
• 06.28 22:00:42
  发表了文章 2022-06-28 22:00:42

  WebAssembly影响未来WEB技术

  WebAssembly（缩写为 Wasm）是一种用于基于堆栈的虚拟机的二进制指令格式， Wasm 被设计为编程语言的可移植编译目标，支持在 Web 上部署客户端和服务器应用程序，它可能会终结所知道的互联网上的隐私和安全。

  
• 06.28 21:51:20
  发表了文章 2022-06-28 21:51:20

  JavaScript 中 Math.random() 生成随机数据

  Math.random() 将生成一个介于0（包括）和 1（不包括）之间的伪随机浮点数（带有小数的数），随机数并不意味着总是得到一个唯一的数字，它会在一段时间后产生相同的数字。这里的间隔很长，所以可能不会得到两次相同的数。
• 06.28 21:50:11
  发表了文章 2022-06-28 21:50:11

  Cron调度任务入门

  Cron 是一款类Unix的操作系统下的基于时间的任务管理系统，Cron 用于操作系统（CentOS）周期性执行程序或者脚本。例如有一个程序，想要每天凌晨 2 点执行，或者需要每周备份一次文件，类似这些事情可以通过一个由 cron 执行的脚本来完成。

  
• 06.28 21:48:23
  发表了文章 2022-06-28 21:48:23

  每天学习 10 个实用Javascript代码片段（六）

  每天学习10个实用JavaScript代码片段，加深对 Javascript 语法的理解，积累代码优化经验，第六天来了，本文代码片段包括生成随机数、数字加密、四舍五入、文件扩展名、变量数字转换。如果觉得内容能够带来点帮助，可以查看专栏《碎片时间学习Javascript代码》其他内容，又或者有用到的需求片段，不妨在留言区留言。
• 06.28 21:46:42
  发表了文章 2022-06-28 21:46:42

  每天学习10个实用Javascript代码片段（五）

  每天学习10个实用Javascript代码片段，加深对 Javascript 语法的理解，积累代码优化经验，第五天终于来了，如果觉得内容能够带来点帮助，可以查看专栏《碎片时间学习Javascript代码》其他内容，又或者有用到的需求片段，不妨在留言区留言。
• 06.28 21:45:31
  发表了文章 2022-06-28 21:45:31

  CSS 数学函数之calc、clamp、min、max

  回想过去，CSS 需要兼容各种版本的浏览器，那种在效果和可用之间痛苦选择的经历记忆犹新。现在的 CSS 能够做很多事情，而对于浏览器的兼容性只需考虑主流的，并且大部分主流的浏览器都支持最新 CSS 特性。本文来总结一下CSS中数学函数之min、max、calc、clamp。
• 06.28 21:44:24
  发表了文章 2022-06-28 21:44:24

  【布道API】权限错误码选择：401、403 或 404

  选择对 API 请求的正确响应有助于保护应用程序，并能够提高项目开发效率。虽然表面上看起来可能并非如此，但每一条不必要的信息都使攻击者更容易了解如何获得访问权限。另一方面，每一个缺失的信息都会让 API 的使用者更难理解对 HTTP 请求的响应。

  
• 06.28 21:43:11
  发表了文章 2022-06-28 21:43:11

  博客升级之在线代码编辑器

  最近打算对个人博客进行优化，主要涉及两个方面，文章编辑器和代码展示分享模块，因此就需要考虑选择什么样的在线编辑器，顺道总结一下在线代码编辑及分享一些可能用得上的优秀代码编辑器。

  
• 06.28 21:39:31
  发表了文章 2022-06-28 21:39:31

  TypeScript 创建单页天气查询应用程序

  关于 TypeScript 是什么，可以在掘金找到很多文章，如想学习一下TypeScript，GitHub是个不错的平台，在文章《收藏GitHub上的7个热门TypeScript项目》介绍几个不错的开源项目。本文将使用TypeScript创建单页应用程序（SPA）示例，天气查询。

  
• 06.28 21:36:00
  发表了文章 2022-06-28 21:36:00

  前端自动化测试及 Karma 介绍

  在前端开发中，大部分时间都是使用人肉加上 console.log 或者 debuger 进行测试，效率及测试质量都是因人而异，加上JavaScript语言本身缺少类型检查，编译期间无法定位到错误，还有常见兼容性问题，都是影响前端开发常见问题。

  
• 06.28 21:34:27
  发表了文章 2022-06-28 21:34:27

  分享 6 个JavaScript学习资源

  Github 不仅仅是代码托管平台，也是一个学习、开源存储库、教程和指南手册的资源平台。通常遇到技术瓶颈或者有解决不了的问题，都会借助 Github 查找学习资源，本文分享6个JavaScript学习资源。

  
• 06.28 21:32:27
  发表了文章 2022-06-28 21:32:27

  Chai 和 Mocha 为API编写测试

  昨天在文章《JavaScript单元测试的“抹茶”组合：Mocha和Chai》介绍了JavaScript单元测试常用组合，本文展示使用 Chai 和 Mocha 为API编写简单的测试用例。

  
• 06.28 21:31:16
  发表了文章 2022-06-28 21:31:16

  JavaScript单元测试的“抹茶”组合：Mocha和Chai

  mocha是一个javascript的测试框架，chai是一个断言库，两者搭配使用更佳，所以合称“抹茶”（其实mocha是咖啡）。“抹茶”特点是： 简单，node和浏览器都可运行。

  
• 06.28 21:29:40
  发表了文章 2022-06-28 21:29:40

  分享 6 个实用的 Vue 技巧

  Vue 已经成为很多公司前端项目的首选框架，而要成为一个会用 Vue 的开发者并不需要花太多时间和精力去学习大的概念，但作为成为一个更高级的开发者就需要去深入框架和基础知识的学习。本文跟分享几个在Vue 项目开发中可以用到的小技巧。
• 06.28 21:28:33
  发表了文章 2022-06-28 21:28:33

  JavaScript 中如何比较变量的相等

  在程序开发过程中，比较两个变量是否相等是很常见的需求，在 JavaScript 中两种变量类型的比较是有所不同的，本文就一起来回顾一下在 JavaScript 如何比较两个变量是否相等。
• 06.28 21:27:00
  发表了文章 2022-06-28 21:27:00

  细说JavaScript正则表达式（RegExp）

  搜索、匹配和聚合是日常网络活动的重要组成部分，例如，当浏览或搜索某些关键字时，会进行大量搜索。为了使 搜索/匹配 高效和精确，像 VsCode 和 Sublime 这样的流行编辑器都是使用正则表达式来支持搜索和替换。因此，在使用这些编辑器的时候，当按下 CTRL + F 组合键时，就可以搜索和匹配选择的文本。
• 06.28 21:25:22
  发表了文章 2022-06-28 21:25:22

  JavaScript 正则表达式的 5 个方法

  现在 JavaScript 非常强大，可以用它做很多事情，移动应用程序、网站、网络应用程序、游戏，甚至可以包括人工智能。JavaScript 生态系统有很多脚本库和框架，可以用它来做很多事情。
• 06.28 21:23:23
  发表了文章 2022-06-28 21:23:23

  2021年最佳VUE3 UI框架推荐

  Vue3已经发布一段时间了，版本趋于稳定并且可以用于生产。虽然很多开发人员对这个版本褒奖不一，新版本由于算是重新构建生态系统，相关资源的缺乏。与Vue2丰富的UI框架相比，Vue3就显得有点少，也算是影响开发人员使用Vue3的原因之一。

  
• 06.28 21:20:18
  发表了文章 2022-06-28 21:20:18

  CSS 文档中定位指南：static、relative、absolute、fixed、sticky

  CSS 中 position 属性用于指定元素的定位方法的类型（static、relative、absolute、fixed、sticky）。

  
• 06.28 21:18:01
  发表了文章 2022-06-28 21:18:01

  从 async 和 await 函数返回值说原理

  昨天在文章《JavaScript中的 async 和 await》中简单的介绍了其使用方法。那么 async 和 await 如何工作，如何正确的使用 async 和 await 。
• 06.28 21:14:25
  发表了文章 2022-06-28 21:14:25

  JavaScript中的 async 和 await

  在 ECMAScript 2017 中添加了 async 函数和 await 关键字，并在主流脚本库和其他 JavaScript 编程中得到广泛的应用。今天带大家一起来学习一下。
• 06.28 21:13:04
  发表了文章 2022-06-28 21:13:04

  前端通讯协议：WebSocket和长轮询

  前面写过文章来对比 WebSockets 和 HTTP ，本文来简单对比WebSockets和长轮询。

  
• 06.28 21:11:13
  发表了文章 2022-06-28 21:11:13

  JavaScript 开发人员应该理解的 this

  初次接触 this 是在 c# 中，再后来的 JavaScript ，两者在 this 处理上非常相似。但是 JavaScript 是一种基于原型的编程语言，没有类的概念。意味着 this 将指向调用函数的对象，通常称为上下文。当然 this 不止于此，在函数内部的引用可以绑定到不同的对象，这得取决于函数是从哪里被调用。this 问题和变量函数提升是前端面试常见的问题，关于变量提升可以参阅《加深Javascript变量函数声明提升理解》
• 06.28 21:10:01
  发表了文章 2022-06-28 21:10:01

  JavaScript代码片段学设计模式

  设计模式是任何优秀软件的基础，JavaScript 也不例外，学习设计模式，让你对代码组织多一些思路，通过代码片段来学习编码思路对于开发者来说是比较容易理解的，本文继续通过代码片段简单展示常见的设计模式，但不深入设计模式本身，在此推荐一本书《JavaScript设计模式》，通俗易懂，阅读完之后可以大幅提升编码水平。
• 06.28 21:08:09
  发表了文章 2022-06-28 21:08:09

  深入学习 CSS 中的伪元素 ::before 和 ::after

  CSS 伪元素用于为元素的指定部分设置样式，作为回顾，先来看下 Mozilla 开发者网站上的解释： 伪元素是一个附加至选择器末的关键词，允许你对被选择元素的特定部分修改样式。例如 ::first-line 伪元素可用于更改段落首行文字的样式。

  
• 06.28 21:05:30
  发表了文章 2022-06-28 21:05:30

  使用 Sequelize 快速构建 PostgreSQL 数据的 CRUD 操作

  之前写过一个专栏《布道API》来介绍API的REST风格及推荐实践，今天开始来构建一个管理系统的API服务，首先需要处理的就是数据存储，本文将结合实际开发总结在 NodeJS 下使用 Sequelize 快速构建 PostgreSQL 数据的 CRUD 操作。

  
• 06.27 16:02:52
  发表了文章 2022-06-27 16:02:52

  Vue3异步数据加载组件：suspense

  Vue3 增加了很多让人眼前一亮的特征，suspense 组件就是其中之一，对处理异步请求数据非常实用，本文通过简单的实例介绍其使用方法，如对其有兴趣，可以参阅官方文档。