2023 进阶清单

10 月 3 日
阅读 1 分钟
238
@by 泯泷纸质书单​ JavaScriptJavaScript权威指南(原书第7版) JavaScript高级程序设计(第4版) 你不知道的JavaScript(上中下) VueVue.js技术内幕 CSSCSS权威指南(第三版) 新书:现代JavaScript库开发:原理、技术与实战React设计原理全面进阶写给初中级前端的高级进阶指南 - 掘金 React技术揭秘 MyBlogDoc/src/浏...

创建型模式 Creation Pattern

10 月 3 日
阅读 13 分钟
265
The Abstract factory pattern is a creative design pattern that creates a series of related objects without specifying their concrete classes.

「译」不要将 DTO (数据传输对象)传递给用户界面组件

10 月 3 日
阅读 3 分钟
370
作为前端开发人员,我们经常使用来自后端 API 或服务的数据传输对象 (DTOs, data transfer objects)。这些 DTO 表示用于在网络中传输的原始数据结构。然而,在 UI 组件中直接使用 DTOs 可能会导致可维护性、可重用性和关注点分离方面的问题。

了解MutationObserver的使用以及在Vue3中的使用案例

9 月 30 日
阅读 2 分钟
218
MutationObserver 是一种浏览器提供的 API,可以在 DOM 的一部分改变时通知我们。在本博客中,我们将逐步讨论如何在常规 JavaScript 和 Vue3 中使用 MutationObserver,并提供一些实际使用案例。

「译」SolidStart 1.0:未来框架的形态

9 月 21 日
阅读 3 分钟
204
同样明显的是,开始使用这项技术并不容易。人们在他们的 webpack 配置中度过了足够艰难的时光。现在我们需要做更多的事情才能在服务器上运作得好。

「译」React 服务器组件 (RSCs) 的深入分析

9 月 21 日
阅读 11 分钟
199
原文:[链接]原标题:# The Forensics Of React Server Components (RSCs)作者:Lazar Nikolov快速总结:我们喜欢客户端渲染,因为它减轻了服务器的负担,但仅提供一个空的 HTML 页面会导致初始加载时的用户体验不佳。我们喜欢服务器端渲染,因为它可以通过快速的 CDN 提供静态资源,但不适用于动态内容的大规模项目。Re...

「译」JavaScript 舍入误差(在金融应用程序中)

9 月 21 日
阅读 3 分钟
300
原文:[链接]原标题:JavaScript Rounding Errors (in Financial Applications)作者:ROBIN WIERUCH

「译」这种模式将破坏你React应用的TS性能

9 月 21 日
阅读 2 分钟
260
原文:This Pattern Will Wreck Your React App's TS Performance | Total TypeScript原标题:This Pattern Will Wreck Your React App's TS Performance作者:Matt Pocock

「译」如何写出更好的Typescript代码

9 月 21 日
阅读 3 分钟
185
译者:本文讨论了 15 个实用技巧,以帮助开发者编写更好的 TypeScript 代码。这些技巧包括可选链接、映射类型、实用类型等,旨在提高代码的安全性、可读性和功能性。通过这些技巧,开发者可以更有效地管理数据类型,从而构建更稳健的应用程序。

「译」如何为应用选择最佳渲染策略

9 月 21 日
阅读 1 分钟
167
原链接:[链接]作者:Alice Alexandra Moore标题:How to choose the best rendering strategy for your app优化代码交付方式的性能。

「译」如何初始化前端项目

9 月 21 日
阅读 3 分钟
179
你已经对该领域有了初步的了解,并确定了一个技术堆栈,现在开始编写你一直在头脑中构思的这个复杂功能。你已经看到 tRPC 集成和客户端状态在你眼前交织。

「译」如何编写 React 应用程序的样式

9 月 21 日
阅读 14 分钟
277
过去十年间,Web 应用程序的构建方式已经发生了根本性的变化。我们现在关注的不是页面,而是组件。不再将数据传递给模板进行渲染,而是管理动态状态。我们借助强大的 API,将以前难以解决的一致性错误简化为微不足道的逻辑处理。

「译」面向 JavaScript 开发人员的 TSConfig 简介

9 月 21 日
阅读 4 分钟
277
JavaScript 从最初作为一种简单的脚本语言开始不断发展,成为用于构建复杂应用程序的强大、现代的语言工具。为了管理更大、复杂的代码库,JavaScript 开发人员不断寻找方法改善他们的工作流程、代码质量和生产力。TypeScript 是一个通过添加类型来提高代码质量和维护效率的重大创新,因此毫不奇怪它是目前增长最快的语言...

「译」谷歌在索引过程中如何处理 JavaScript

9 月 21 日
阅读 8 分钟
154
原文:[链接]原标题:How Google handles JavaScript throughout the indexing process作者:Giacomo Zecchini 等MERJ 和 Vercel 的研究通过经验证据揭开了 Google 渲染的神秘面纱。

「译」从简单到复杂 —— 软件四象限

9 月 21 日
阅读 2 分钟
145
原文:From trivial to complex – 4 software quadrants | Swizec Teller原标题:An intro to TSConfig for JavaScript Developers作者:Jo Franchetti多年来我一直试图捕捉复杂软件和繁杂软件之间的区别,我想我终于明白了。我们可以将项目分为 4 个象限!在一个轴上,你有难与易建造。在另一个轴上,是解决方案已知与...

「译」不要将 DTO 传递给用户界面组件

9 月 21 日
阅读 3 分钟
154
作为前端开发人员,我们经常使用来自后端 API 或服务的数据传输对象 (DTOs, data transfer objects)。这些 DTO 表示用于在网络中传输的原始数据结构。然而,在 UI 组件中直接使用 DTOs 可能会导致可维护性、可重用性和关注点分离方面的问题。

[译] 每个开发人员都应该知道的五大Node.js功能

2 月 17 日
阅读 6 分钟
507
标题:Top 5 Node.js Features Every Developer Should Know作者:Danusha Navod链接:[链接]
封面图

ECMAScript 装饰器的 10 年

2023-11-18
阅读 8 分钟
868
2015年,ECMAScript 6 发布,这是JavaScript语言的一个重大发布。这个版本引入了许多新特性,比如const/let、箭头函数、类等。大多数这些特性的目标是消除JavaScript的怪癖。因此,所有这些特性都被标记为“Harmony”。一些消息来源称整个ECMAScript 6被称为“ECMAScript Harmony”。除了这些特性,“Harmony”标签还突出了其...

Web浏览器滚动方案一览| scrollTo、scrollBy、scrollIntoView、使用rAF等

2023-10-16
阅读 6 分钟
3.1k
在Web开发中,实现流畅的滚动效果对于提升用户体验至关重要。为了实现这一目标,开发人员可以利用一系列的滚动方案。其中,请求动画帧(requestAnimationFrame,简称rAF)是一种常用的技术。rAF通过优化动画效果的渲染,可以避免卡顿和过度绘制的问题。此外,还有其他滚动方案如CSS动画、滚动事件监听等等,开发人员可以...

使用Node.js、pm2和ssh2模块实现一个简单的Node.js项目部署脚本

2023-10-15
阅读 7 分钟
897
本文将介绍如何使用Node.js和ssh2模块实现一个简单的部署脚本,将本地的项目文件上传到远程服务器上。我们将使用dotenv模块来管理环境变量,以及child_process模块来执行命令行操作。

使用Node.js、Express.js、TS写个简单的图床脚本(一)

2023-10-15
阅读 6 分钟
500
在这篇博客文章中,我将介绍如何使用 TypeScript 和 Express 框架来编写一个简单的图床脚本,可以将本地图片上传到服务器,并返回图片的 URL。这样,你就可以在 Markdown 文档中方便地引用图片,而不用担心图片的存储和管理问题。

Chrome浏览器插件Manifest V3 简介

2023-10-15
阅读 3 分钟
1.1k
随着互联网的快速发展,浏览器插件成为了许多用户提升浏览器功能和个性化体验的重要工具。Chrome浏览器作为全球最受欢迎的浏览器之一,其插件生态系统也日益壮大。为了保证插件的安全性和性能,Chrome团队推出了Manifest V3,这是一种新的插件开发规范。

Web Woker 与主线程通信场景下对postMessage的简洁封装

2023-09-19
阅读 7 分钟
1.6k
在Web Worker与主线程之间进行通信时,使用postMessage是一种常见的方式。然而,在某些业务场景中,postMessage可能会显得不够简洁,因为它涉及到手动序列化和反序列化数据,以及通过事件监听器处理消息。以下是一些常见问题和解决方案,以简化在Web Worker与主线程之间的通信场景中使用postMessage的问题。

Web Woker 常见使用问题和解决方案

2023-09-19
阅读 6 分钟
2.4k
new Worker(aURL, options) URL 必须遵守同源策略。同源策略是浏览器的一种安全特性,限制了在不同源(协议、域名、端口)之间的 JavaScript 代码的访问。这意味着在 Web Worker 中,只能加载与当前页面在同一源下的脚本,否则会触发安全错误。

Astro 集成 Vue 框架教程

2023-09-16
阅读 4 分钟
967
Astro的集成能力支持我们使用Vue3编写的组件,并且支持SSR(server-side rendering)和CSH(client-side hydration)

Astro 中启用服务器端渲染

2023-09-16
阅读 2 分钟
583
Astro 中通过 Node.js 启用服务器端渲染在 Astro 中启用服务端渲染(SSR, Server Side Rendering)非常简单,而且启用后可以使用新的特性:在应用程序中实现登录状态会话。用 fetch 动态调用 API 来渲染数据。通过适配器部署你的网站。适配器为了启用 SSR,你需要使用适配器(Adapter)。这是因为 SSR 需要服务器运行时环...
封面图

BFF 模式 (Backend For Frontend)

2023-09-16
阅读 3 分钟
1.5k
面试提到了,所以来学习聊聊PS:你应该记住,BFF 是客户端和服务之间的转换层。 当数据从服务端API 返回时,其目的是将其转换为客户端应用程序指定的数据类型。 避免BFF 逻辑重复——需要注意的一个关键点是,单个BFF 应该满足特定的用户体验,而不是设备类型。 例如,大多数时候,所有移动设备(iOS、Android 等)共享相同...

同构渲染:SSR (Server-Side Rendering) 与CSH (Client-Side Hydration)

2023-09-16
阅读 2 分钟
524
同构(Isomorphic) JavaScript,通常称为通用(Universal)JavaScript,在服务器端和客户端均渲染。在这种呈现方法下,预渲染用于向搜索引擎或用户提供的内容。之后,JavaScript 所需的交互内容在客户端处理。
封面图

强缓存和协商缓存

2023-09-16
阅读 2 分钟
457
Web 缓存是可以自动保存常见文档副本的 HTTP 设备。当 Web 请求抵达缓存时, 如果本地有“已缓存的”副本,就可以从本地存储设备而不是原始服务器中提取这 个文档。(此结论来自http权威指南)
封面图

前端应用的静态测试vs单元测试vs集成测试vsE2E(端到端)测试

2023-09-16
阅读 8 分钟
539
原文:Static vs Unit vs Integration vs E2E Testing for Frontend Apps --- 前端应用的静态测试与单元测试与集成测试与E2E测试标题:Static vs Unit vs Integration vs E2E Testing for Frontend Apps作者:Kent C. Dodds
封面图