视野修炼-技术周刊第89期 | 2023 年度 JS 报告

news/2024/9/22 17:21:43

欢迎来到第 89 期的【视野修炼 - 技术周刊】,下面是本期的精选内容简介

🔥强烈推荐

  1. JavaScript 2023 年度调查报告 - Vite 赢麻了!
  2. Node.js setTimeout Promise
  3. local-web-server
  4. 尤大:Vue 10周年演讲 - Vue过去与未来

🔧开源工具&技术资讯

  1. loadership - 纯 CSS loading 动画生成
  2. Entity Code - 插件CV符号
  3. linaria - 0运行时的 CSS in JS库

📚 教程&文章

  1. 镜头模糊效果

🤖AI工具&资讯

  1. DeepSeek Coder - 在线生成网页代码并执行

​也推荐大家关注一下最后的推荐内容(周刊的主要内容来源渠道)

下面开始本期内容的介绍,预计阅读时间 8 分钟。

🔥强烈推荐

1. JavaScript 2023 年度调查报告 - Vite 赢麻了!

2023 年度 JavaScript 开发者调查结果现已出炉!

从中可以解 JS 开发人员使用和不使用哪些功能、库受欢迎程度随时间的变化、人们使用哪些构建工具、JavaScript 和 TypeScript 使用之间的区别等等。

最受欢迎(从榜单中只挑了部分展示)

  • 语法特性:空值合并 ??;
  • 字符串特性:replaceAll;
  • 数组特性:findLast;
  • 异步特性:顶层 await;
  • 前端框架:React;
  • 其它框架:Astro;
  • monorepo: pnpm;
  • 工具类库:lodash;
  • 100%TS使用情况远大于100% JS;

Vite 霸榜了

2. Node.js setTimeout Promise

js 本身是没有 sleep 方法的,通常咱们会使用 Promise + setTimeout 来实现延时效果,向下面这样。

function sleep(ms) {return new Promise(resolve => setTimeout(resolve, ms))
}

本周在迭代一个 CLI 工具时,用到了 clack 这个库(一个漂亮的终端 UI 交互库),里面的示例有如下的代码。

import { setTimeout as sleep } from 'node:timers/promises'async function main() {await sleep(1000)
}main().catch(console.error)

印象中 setTimeout Promise 这个确实被支持了,但一直认为在实验阶段,毕竟在浏览器中默认没有 promise 化。

看了一下文档,这个在 Node 16 就支持了。

又学到一手,以后写 node 项目,可以直接 await setTimeout 了。

3. local-web-server

用于创建本地静态资源服务,支持非常简单的方式设置 proxy(反向代理)SPA 支持。

# 安装
npm install -g local-web-server# 代理 dist 目录,设置 SPA 入口文件,以 /api 开头请求转发到后端服务
ws -d dist --spa index.html --rewrite '/api/(.*) -> http://127.0.0.1:3000/$1'

下面是运行示例,可以非常清楚的看到请求的 状态码, 耗时, 响应大小等信息。

在此之前笔者一直使用 http-server 创建本地静态资源服务,但在最近开发的时候想要设置 proxy,用着非常不方便,SPA 应用入口文件也无法修改,刷新后页面就 404 了。

star ⭐️ 起来,肯定能用上👍🏻!

4. 尤大:Vue 10周年演讲 - Vue过去与未来

🔧开源工具&技术资讯

5. loadership - 纯 CSS loading 动画生成

使用非常简单,复制就能跑的代码。

6. Entity Code - 插件CV符号

这个网站收集了许多高频 C/V 的字符。

7. linaria - 0运行时的 CSS in JS库

在 JS 中编写 CSS,并在构建过程中获取真实的 CSS 文件。将基于动态 prop 的样式与 React 绑定结合使用,并将它们自动转换为 CSS 变量。

📚 教程&文章

8. 镜头模糊效果

🤖AI工具&资讯

9. DeepSeek Coder - 在线生成网页代码并执行

支持根据提示词生成完整的 HTML/CSS/JS 代码,并可以直接在线运行,效果很棒棒。

文章里介绍了 五子棋,飞行射击,扫雷,2048,计算器等经典小应用代码一键生成的能力。

笔者也试了一下生成一个井字棋!

咒语如下:

用 HTML、CSS 和 JavaScript 实现一个井字棋游戏的所有逻辑,棋盘是天空白云。

笔者又拿 gpt-4o-2024-05-13 试了一下,效果十分接近,各有优势。

注册就送 500w token,冲冲冲,写小 demo 还是很方便!

😛趣图


篇幅有限,如果你还没看够,可移步后面的推荐渠道,继续游览,历史周刊(<20)移步博客

⭐️强力推荐关注

  • 阮一峰: 科技爱好者周刊 - 记录每周值得分享的科技内容,周五发布
  • 前端RSS - 根据 RSS 订阅源抓取最新前端技术文章
  • 值得一读技术博客 - 每天进步一点点,每天分享有料的技术文章!
  • FRE123 技术周刊精选 - 前后端技术周刊精选推荐信息流

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.ryyt.cn/news/46996.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈,一经查实,立即删除!

相关文章

小鲤AI志愿填报助手:一键探索最适合你的大学专业

背景 每年六月,随着高考的落幕,一个新的挑战随之而来——如何在全国范围内的激烈竞争中抢占一席之地。今年,超过1300万的学生参加了这场决定未来命运的考试,每一个人都希望能进入心仪的大学,学习理想的专业。然而,选择的过程并不简单,错综复杂的分数线、众多的院校和专业…

UE 不修改源码实现遮罩控件 (Mask Widget)

本文内容的参考和灵感来自以下链接 GitHub - inkiu0/MaskWidget: UE4 MaskWidget GitHub - JanSeliv/CustomShapeButton: Open-source plugin that allows to make buttons of any shape in UE5.4 在 UE 有一个很麻烦的地方,Slate 事件不是按照堆叠顺序传递的,就会形成以下现…

【服务器】Ubuntu虚拟内存设置

引子 最近服务器内存老是爆掉,64G的内存对于四五个人同时使用还是有点勉强,上网查询了一下虚拟内存的教程,本博客记录一下方法。swap内存设置 假设你想将swap文件放在/mnt/data/mem目录下,以下是详细的步骤: 创建并启用Swap文件创建目录(如果目录不存在): sudo mkdir -…

作业7

task1. 点击查看代码 // 将图书信息写入文本文件data1.txt // 再从文件中读取图书信息,打印输出到屏幕上,并显示行号#include <stdio.h>#define N 80 #define M 100typedef struct {char name[N]; // 书名 char author[N]; // 作者 } Book;// 函数声明 void func1()…

使用cloudflare-works搭建自己docker加速源

在网上看到了许多教程,基本上部署都是手动的,docker镜像都要手动输入选择重新部署。要么都是些基本镜像仓库。 视频地址:【CloudFlare搭建doker加速源。都这么长时间了,你的docker还是跑不通吗?】 https://www.bilibili.com/video/BV1F533eHEsB/?share_source=copy_web&a…

AI 大模型企业应用实战(06)-初识LangChain

LLM大模型与AI应用的粘合剂。 1 langchain是什么以及发展过程 LangChain是一个开源框架,旨在简化使用大型语言模型构建端到端应用程序的过程,也是ReAct(reason+act)论文的落地实现。2022年10月25日开源 54K+ star 种子轮一周1000万美金,A轮2500万美金 11个月里累计发布200多…

创新实现(九)——博客处理

博客部分 当用户需要针对OJ上的比赛以及题目进行相关讨论的时候,OJ平台给大家一个博客平台供大家交流讨论。博客部分中利用blogs.php文件进行最近前10个博客的显示,用户可以利用右上角的按钮查看自己的博客情况以及自己写一个博客。 博客总览blogs.php文件用于生成一个博客总…

面向对象大作业总结(三)

一.前言:本次博客是对第七到八次大作业进行总结。我认为第七次大作业相比于同一道题来说,并没有进行太大的改变,因为它不需要考虑每个元件左右两端到底电位状态如何,也就是在前两次的基础上增加了一些并联电路,这个时候我们只要在MainLine类里新增并联以及串联电路的判断就…