今年も GitHub のトレンドで 2021 年の JavaScript/TypeScript を振り返ります。去年の記事はこちらです。 — GitHub のトレンドで振り返る 2020 年の JavaScript | WEB EGG 集計方法 GitHub トレンドは過去の履歴を公式に提供していないため、非公式に集計されたデータを利用しています。 データソースはlarsbijl/trending_archiveを使用 去年はxiaobaiha/github-trending-historyを利用したが今年のデータは無かったので変更 日ごとにまとめた markdown になっており、remark で AST→ データ化しました 集計期間は 2021/01/01 から 2021/12/15 まで 対象言語はJavaScriptとTypeScriptのみ 集計後のデータはこちらのスプレッドシー
主なNode.js独自API
// CommonJS Modules の場合 const fs = require("fs"); const fs = require("node:fs"); // ES Modules の場合 import fs from "fs"; import fs from "node:fs"; process のように、グローバル変数としても組み込みモジュールとしても提供されているAPIもあります。 global globalThisの別名です。Webブラウザでは window と self がglobalThisの別名として定義されていますが、Node.jsには window や self はなく、かわりに global が定義されています。 Buffer ArrayBuffer, TypedArray (Uint8Arrayなど), DataView はJavaScriptの標準機能です。
structuredCloneはどんなものか
structuredCloneは、JavaScriptにおいてオブジェクトのディープコピーができる便利な関数です。 従来ディープコピーの標準化された方法が無かったため、structuredCloneの登場はJavaScriptのユーザーにとって画期的なものです。あまりに画期的であり、その便利さも分かりやすいため、出たばかりの時期はTwitterでのJavaScript豆知識ツイートの常連でした。 現在はstructuredCloneのもの珍しさは無くなり、単純に便利なAPIとして受け入れられていますが、そのせいかstructuredCloneに対する理解も単純な人が出てきているようです。 そこで、この記事ではstructuredCloneがどのようなものなのか、どうしてそのようになっているのかについて、じっくりと説明します。 structuredCloneの歴史 筆者は自称世界一技術の歴史
本日、CloudflareはVercel、Shopify、およびNode.jsとDenoの両方の中心的な個々のコントリビューターと協力して、Webブラウザではない、JavaScriptベース開発環境で標準化Web APIを相互運用できる実装に焦点を当てた、新しいコミュニティグループの設立を発表いたします。 W3CおよびWeb Hypertext Application Technology Working Group（WHATWG）は、開発環境としての標準化APIとWebの機能を、長い間先頭に立って開発してきました。fetch()、ReadableStreamおよび WritableStream、URL、URLPattern、TextEncoder などのAPIは、現代のWeb開発における馴染みの、そして貴重なコンポーネントになりました。ただし、これら既存グループは常にWebブラウザの特定
If you don’t yet have Deno installed, you can install it with one of the following commands, or many other ways. MacOS / Linux Install curl -fsSL https://deno.land/x/install/install.sh | shWindows Install irm https://deno.land/install.ps1 | iex Here’s an overview of what’s new in Deno 1.38. deno doc improvements: The new deno doc --html command generates a static site with documentation for your p
Highlights This is a summary of the significant changes, both breaking and non-breaking, you need to know about when upgrading from ESLint v8.x to ESLint v9.0.0. Installing Because this is a major release, you may not automatically be upgraded by npm. To ensure you are using this version, run: npm i eslint@9.0.0 --save-dev Copy code to clipboard Migration Guide As there are a lot of changes, we’ve
2021/10/19にリリースされたNode.js v17の主な変更点を紹介します。 nodejs.org QUICがサポートされたOpenSSLにアップデート V8 が 9.5 にアップデート Intl.DisplayNames Intl.DateTimeFormat Promiseベースのreadline APIの追加 WHATWG Stream との互換性の強化 ディープクローンが簡単になる structuredClone の追加 Node.js v16からの機能 まとめ 参考資料 QUICがサポートされたOpenSSLにアップデート Node.jsのHTTPSなどのAPIで使われるOpenSSLのバージョンが1.1.0から3.0.0にアップデートされました。 OpenSSL-3.0.0はQUICをサポートしています。これによりNode.jsでもQUICをサポートできるようになります
構造化複製アルゴリズムとは 構造化複製アルゴリズム（The structured clone algorithm）とは HTML Standard の中で定義されている JavaScript の値をシリアライズ、デシリアライズするアルゴリズムのことを言います[1]。postMessage や、IndexedDB に格納する際など用いられます。 対応している値 ECMAScript で定義されているものについては Symbol を除くプリミティブ値とプリミティブラッパーオブジェクト Date RegExp[2] ArrayBuffer, SharedArrayBuffer ArrayBufferView (TypedArray, DataView) Map, Set Error[3] NativeError (EvalError, RangeError, ReferenceError, Sy
Next.jsのCacheを網羅したドキュメントの公開など : Cybozu Frontend Weekly (2023-08-01号)
Next.jsのCacheを網羅したドキュメントの公開など : Cybozu Frontend Weekly (2023-08-01号) こんにちは！サイボウズ株式会社フロントエンドエキスパートチームの @nus3_ です。 はじめに サイボウズでは毎週火曜日に Frontend Weekly という「1 週間の間にあったフロントエンドニュースを共有する会」を社内で開催しています。 今回は、2023/08/01 の Frontend Weekly で取り上げた記事や話題を紹介します。 How React 18 Improves Application Performance – Vercel React18で新しく導入されたTransitions、Suspense、React Server Componentsなどをパフォーマンスの観点から解説しています。React17以前とReact18
JSer.info #583 - React 18 RCがリリースされました。 How to Upgrade to the React 18 Release Candidate – React Blog React 18 RCではIEのサポートが終了しています。 ReactDOMのrender APIをDeprecatedとし、createRoot APIの利用が推奨となっています。 SSR APIのrenderToNodeStreamを非推奨化し、SuspenseをサポートしたrenderToPipeableStreamとrenderToReadableStreamが追加されています。 setStateなどのステート更新を自動的にバッジ処理するようにし、React 17の挙動を再現するためのflushSyncAPIが追加されています。 また、ReduxなどのReact外でステート管理する
JSer.info #653 - Node.js v20.5.0がリリースされました。 Node v20.5.0 (Current) | Node.js Test Runnerに--test-shardフラグの追加、node:eventsにaddAbortListenerを追加、fs.readFileSyncでUTF-8のファイルを読み込むときのパフォーマンスを改善などが行われています。 Bun v0.7.0がリリースされました。 Bun v0.7.0 | Bun Blog Viteのサポート、Worker APIのサポート、structuredClone()のサポート、AsyncLocalStorageのサポートが追加されています。 実行時のパフォーマンスを犠牲にメモリ消費量を抑えるbun --smolフラグのサポート、bun test --bail=<number>のサポート、Node
JavaScript でのstructuredClone関数が Chrome98 から使えるようになりました 🎉 structuredCloneを利用する事で、簡単にオブジェクトのディープコピーができるようになりました。 すごく便利そうだな...!!と思った関数なので実際に試してみました。 structuredClone 本題のstructuredCloneです。 structuredCloneは一言で言うと「構造化複製アルゴリズムに従って、指定された値のディープクローンを生成するメソッド」です。 つまり、構造化複製アルゴリズムに対応する値はstructuredCloneを使うとディープコピーした上で値を返してくれる、と言うことです。 IE には対応していませんが、Chrome、Edge、Firefox 等の主要なブラウザは対応してきているので、Object.assignやライブラリの
JSer.info #655 - Lighthouse v11.0.0がリリースされました。 Release v11.0.0 · GoogleChrome/lighthouse Node.js 16のサポート終了、デフォルトでは使われてなかったresource-summary/service-worker/first-contentful-paint-3gのAuditを削除などの変更が含まれます。 また、INPのAuditがStableへと移行されています。 Astro 2.10がリリースされました。 Astro 2.10: Persistent State in View Transitions | Astro Astro 2.9で実験的にサポートされたView Transitionsに加える形で、指定した要素を永続的にするtransition:persistディレクティブが追加されてい
2024-08-22, Version 22.7.0 (Current), @RafaelGSS Experimental transform types support With the new flag --experimental-transform-types it is possible to enable the transformation of TypeScript-only syntax into JavaScript code. This feature allows Node.js to support TypeScript syntax such as Enum and namespace. Thanks to Marco Ippolito for making this work on #54283. Module syntax detection is now
Web Sessions at Google I/O 2023の気になった発表のまとめ - console.lealog();
まとめプレイリストが公開されてたので、その中から気になったやつを流し見した。 https://www.youtube.com/playlist?list=PLOU2XLYxmsIJGxIV8Lt8gF_79Z334LQ6h What's new in Web https://www.youtube.com/watch?v=x9rh0Du4Czg ブラウザで使える最新機能のご紹介 `dialog`要素はいいぞ `showModal()`のほう フォーカスやタブ管理までブラウザがやってくれるし、スタッキングコンテキストも安心 CSS transform `transform: scale(1)`を`scale: 1`って書けるように 複数の組み合わせでもコードがごちゃつかない 新しいCSSの単位 `lv(h|w|min|max)`、`sv(h|w|min|max)`、`dv(h|w|min|m
Node.js
Notable changes Add support for externally shared js builtins By default Node.js is built so that all dependencies are bundled into the Node.js binary itself. Some Node.js distributions prefer to manage dependencies externally. There are existing build options that allow dependencies with native code to be externalized. This commit adds additional options so that dependencies with JavaScript code
JSer.info #574 - Improving Core Web Vitals, A Smashing Magazine Case Studyという記事では、Smashing MagazineのCore Web Vitals(LCP/FID/CLS)のスコアをどのように改善していったかについて書かれています。 Core Web VitalsはGoogle検索の指標に使われています。 また、Google Search Consoleでは、グローバルなChromeユーザーからのCore Web Vitalsのスコアを確認でき、この値はChrome User Experience Report のデータを元にしています。 サイトのLCPの改善をしたところ、なぜかGoogle Search Consoleの結果は改善されなかったという問題を掘り下げていったという内容になっています。 Smas
Cloudflare Workers では Module Worker Syntax と Service Worker Syntax の２つの記述方式が存在している。 Service Worker Syntax を利用している場合、環境変数はすべてグローバル変数として利用可能になる。 この方法はデバッグ目的とかで使える多分便利な技である。 addEventListener('fetch', (event: FetchEvent) => { // @ts-ignore console.log({ ...global }) event.respondWith(new Response("Hello, World!!")) }) コードを読んで分かる通り、グローバルで扱えるものすべて global 変数に格納されている。これは @cloudflare/workers-types にも定義されてい
2024-09-17, Version 22.9.0 (Current), @RafaelGSS New API to retrieve execution Stack Trace A new API getCallSite has been introduced to the util module. This API allows users to retrieve the stacktrace of the current execution. Example: const util = require('node:util'); function exampleFunction() { const callSites = util.getCallSite(); console.log('Call Sites:'); callSites.forEach((callSite, inde
Introduction There is a wide base of ECMAScript runtime environments being used beyond web browsers, specifically in web server and edge platforms. A major benefit to this approach is the ability to use a single programming language across multiple contexts, reducing specialisation and allowing for reuse of code across the server and client side. Since code running in web browsers makes up the vas
An overview of Node.js: architecture, APIs, event loop, concurrency
Warning: This blog post is outdated. Instead, read chapter “An overview of Node.js: architecture, APIs, event loop, concurrency” in “Shell scripting with Node.js”. This blog post gives an overview of how Node.js works: What its architecture looks like. How its APIs are structured. A few highlights of its global variables and built-in modules. How it runs JavaScript in a single thread via an event
Here is a list of common JavaScript interview questions with detailed answers to help you prepare for the interview as a JavaScript developer. JavaScript continues to be a cornerstone of web development, powering dynamic and interactive experiences across the web. As the language evolves, so does the complexity and scope of interview questions for JavaScript developers. Whether you’re a fresher de
Node.js
Notable Changes Updated npm to 9.2.0 Based on the list of guidelines we've established on integrating npm and node, here is a grouped list of the breaking changes with the reasoning as to why they fit within the guidelines linked above. Note that all the breaking changes were made in 9.0.0. All subsequent minor and patch releases after [email protected] do not contain any breaking changes. Engines
JSer.info #562 - ビルドツールのParcel v2がリリースされました。 Announcing Parcel v2! Parcelは設定なしで動作することを目的にしているため、v1ではプラグインの仕組みは薄い形になっていました。 Parcel v2ではプラグインの仕組みを刷新し、様々なケースに対応できるようになっています。 Plugins また、Tree Shakingをデフォルト化、SWCベースのJavaScriptコンパイラに変更、ModernとLegacyビルドの出し分け、Image optimizerの追加されています。 その他にも、bundleのインライン化、ライブラリ向けのビルドのサポート、C++やRustでコアモジュールの一部を書き直し、ビルドパフォーマンスの改善なども含まれています。 Parcel v1からマイグレーションについてのドキュメントも公開されてい
2023-11-14, Version 21.2.0 (Current), @targos Notable Changes [e25c65ee2f] - doc: add MrJithil to collaborators (Jithil P Ponnan) #50666 [f2366573f9] - doc: add Ethan-Arrowood as a collaborator (Ethan Arrowood) #50393 [eac9cc5fcb] - (SEMVER-MINOR) esm: add import.meta.dirname and import.meta.filename (James Sumners) #48740 [7e151114b1] - fs: add stacktrace to fs/promises (翠 / green) #49849 [6dbb28
Node.js
Notable Changes Deprecations and Removals [f182b9b29f] - (SEMVER-MAJOR) dns: runtime deprecate type coercion of dns.lookup options (Antoine du Hamel) #39793 [4b030d0573] - doc: deprecate (doc-only) http abort related (dr-js) #36670 [36e2ffe6dc] - (SEMVER-MAJOR) module: subpath folder mappings EOL (Guy Bedford) #40121 [64287e4d45] - (SEMVER-MAJOR) module: runtime deprecate trailing slash patterns (
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHubのトレンドで振り返る2021年のJavaScript/TypeScript
Web相互運用性JavaScriptランタイムコミュニティグループ
Deno 1.38: HTML doc generator and HMR | Deno
ESLint v9.0.0 released - ESLint - Pluggable JavaScript Linter
Node.js v17 の主な変更点 - 別にしんどくないブログ
構造化複製アルゴリズムを使ったオブジェクトのディープコピー
2022-03-15のJS: React 18 RC、playwright v1.20.0、Safari 15.4の変更点
2023-07-28のJS: Node.js v20.5.0、Bun v0.7.0、Redwood v6.0.0
structuredCloneを使ってオブジェクトをディープコピーする
2023-08-10のJS: Lighthouse v11.0.0、Astro 2.10(View Transitions)、SharpのWebAssemblyビルド
Node.js — Node.js 22.7.0 (Current)
2022-01-11のJS: グローバルなサイトにおけるCore Web Vitals、2021 JavaScript Rising Stars、colors.jsのインシデント対応
Cloudflare Workers で使えるグローバル変数を一覧する - アルパカの徒然文
Node.js — Node.js 22.9.0 (Current)
Minimum common web API
JavaScript Interview Questions
2021-10-20のJS: Parcel v2、Node v17.0.0、Nuxt 3 beta
Node.js — Node.js 21.2.0 (Current)