開催から２週間が経ってしまいましたが、2023年2月3日にKyoto.js 18を開催しました。開催レポートというよりは個人的な振り返りを。 今回のKyoto.jsは通算で18回目の開催で、前回が2020年1月11日だったので、3年ぶりの開催になりました。会場は復活1回目ということで諸々のコントロールが自分で効かせられる株式会社Helpfeelの京都オフィスで開催しました。 まずは、とにかくKyoto.jsを復活させられて、久しぶりに参加者の皆さんと会って、JSやWebや色んな話をする時間を作れたのが本当に嬉しかったです。 3年ぶりのKyoto.js現地参加者の皆さん 久しぶりの開催だったので、どうなるかとドキドキだったのですが、connpassのイベントページを公開した途端にすぐにオフライン参加枠が埋まってしまって、多くの人たちに楽しみにしてもらえていたのだなと思いました。一方で、その結
Show navigation The JavaScript specification includes a lot of built-in functionality, from math functions to a full-featured regular expression engine. Every newly-created V8 context has these functions available from the start. For this to work, the global object (for example, the window object in a browser) and all the built-in functionality must be set up and initialized into V8’s heap at the
Hi. I am (@zloirock), a full-time open-source developer. I don't like to write long posts, but it seems it is high time to do it. Initially, this post was supposed to be a post about the start of active development of the new major version of core-js and the roadmap (it was moved to the second half), however, due to recent events, it became a really long post about many different things... I'm fuc
Property Based Testing ライブラリの fast-check を試してみたのでまとめます。 Property Based Testingとは？ Property Based Testing は、Haskell のライブラリ QuickCheck からはじまったテストスタイルで、定義された条件に合わせて自動生成された膨大な値に対してテストを行う手法です。Property Based Testing のライブラリに入力値の条件を渡すと、その条件から複数のテストケースを自動生成し実行してくれます。 短いコードで膨大なテストケースを検証できる点、テストケースが開発者に依存せず意図しないエッジケースをテストできる点がメリットとしてあります。 （参考） fast-checkとは？ fast-check は JavaScript で Property Based Testing を実
はじめましての人ははじめまして。そうでないひとはお久しぶりです。猫ロキP(@deflis/id:deflis55)です。 みなさんはReactでテスト書いてますか？私は最近書き始めました。 タイトル通りなんですが Testing Library のテストは、Testing Libraryに標準で入っている fireEvent よりも、外部ライブラリの @testing-library/user-event を使おうというお話です。 user-event はシンプルに書ける上に、メリットがたくさんあるのでおすすめのライブラリです。 なぜ user-event を使うべきなのか なぜこれを使おうというになるか話かというと、 fireEvent は単純にDOMイベントを発生させるのに対し、 user-event は全ての入力に対するイベントを発生させるからです。 でも、それ以上に簡素に書けること
The JavaScript Promise Integration (JSPI) API allows WebAssembly applications that were written assuming synchronous access to external functionality to operate smoothly in an environment where the functionality is actually asynchronous. This note outlines what the core capabilities of the JSPI API are, how to access it, how to develop software for it and offers some examples to try out. What is ‘
ある時Twitterのタイムラインを見ていたら、「JavaScriptをWasm化して動かす意味がわからない」というような意見を見かけました。JavaScriptはブラウザに搭載されているV8のようなJavaScriptエンジンによって高速に動作するので、わざわざWasm化してもパフォーマンスは劣化するのになぜなのか?という話なんですが、これは「Wasm化=パフォーマンスのため」という考えだと意義がわからないのでこの記事ではそれについて解説します。 JavaScriptをWasm化して動かすツールやライブラリとしては、Shopifyが開発しているJavyやquickjs-emscriptenなどがあります。JavaScriptをWasm化して動かすためには、ある特定のJavaScriptエンジンをWasm向けにビルドして動かす必要がありますが、そのような用途ではQuickJSというJava
先日、次のような Tweet を見かけました TIL I discovered that TensorFlow.js uses an interesting trick to sniff your CPU architecture in WebAssembly. pic.twitter.com/LVyywIM48I — Robert Knight (@robknight_) January 4, 2023 面白かったので、なぜこうなるのかの解説と、ついでにこのテクニックを使った JIT 検知方法などについて紹介します。 JavaScript における低レイヤーの扱い JavaScript においては、挙動が比較的しっかりと仕様に定められているために、環境による振る舞いの違いはあまり発生しません。しかし、低レイヤーに降りるほど振る舞いは実装依存になり、環境差が発生する余地が出てきます。 一番
Worker Tools are a collection of TypeScript libraries for writing web servers in Worker Runtimes such as Cloudflare Workers and Deno Deploy. ToolsServicesHow to UseExamplesQuestionsWhat niche do Worker Tools fill?Tools🧭 Worker Router — Complete routing solution that works across CF Workers, Deno and Service Workers🔋 Worker Middleware — A suite of standalone HTTP server-side middleware with TypeS
Cloudflare Workersで簡単にGoのHTTPサーバーを動かすためのライブラリを作ったので、紹介させていただきます。(まだかなり実験的な実装です) 特徴 http.Handlerを作って、 workers.Serve に渡すだけでCloudflare Workers上でHTTPサーバーとして動作する 必要なツールはtinygoとwrangler (Cloudflare WorkersのCLI) だけ JavaScript側のコードを触る必要が無い Cloudflare R2のバインディング（一部）を提供している 今後、KV等の対応も頑張る予定 デモ 下記のURLにアクセスすると Hello, world! と表示され、例としてURL末尾の world を syumai に差し替えると、 Hello, syumai! と表示されます。 ソースコードは、以下のような非常にシンプルな
Back to BlogThursday, December 22nd 2022 Next.js 13.1Posted by Next.js 13.1 includes improvements to both the pages/ (stable) and app/ (beta) directories: app Directory (Beta) Improvements: Improved reliability and performance. Built-in Module Transpilation: Bringing next-transpile-modules capabilities into core. Edge Runtime (Stable): A light Node.js runtime for the Edge. Turbopack Updates: Suppo
[JavaScript] URLを文字列結合で組み立てないために、url-cheatsheetを作った URLを文字列結合で組み立てると色々問題が起きやすいので、それを避けるためにURL APIやURLSearchParams APIでURLを組み立てるパターンをまとめたチートシートを作りました。 azu/url-cheatsheet: URL manipulation cheatsheet for JavaScript URLにユーザーが入力した文字列を含めるときはencodeURIComponentでエスケープする URLはプレーンな文字列ではなく構造化された文字列(文字の並びに意味がある文字列)として扱わないと、さまざまな問題を抱えやすいです。 たとえば、次のように文字列結合でURLを組み立てるとパストラバーサルの問題があります。 name に ../../adminのような文字列が
![[JavaScript] URLを文字列結合で組み立てないために、url-cheatsheetを作った](https://cdn-ak-scissors.b.st-hatena.com/image/square/b26f7dc8f9e783316f720174980e93c627438d74/height=288;version=1;width=512/https%3A%2F%2Fsiteproxy.ruqli.workers.dev%3A443%2Fhttps%2Fefcl.info%2Fpublic%2Ffavicon.png)
これは Chromium Browser アドベントカレンダーの十日目の記事です。本記事では Chromium における JavaScript のスレッド並列実行環境について仕様・実装・API の面から包括的に紹介します。ブラウザの内部実装に興味がある人を対象に、各機能の使い方ではなく実行モデルに焦点を当てて説明しているため、難易度は高いです。使い方を知りたい人は MDN などの記事を読んでください。この記事をきっかけに実装解読に挑戦してみる人が一人でも増えると幸いです。 本記事を書くにあたり、yuki3 さんに多くのコメントをいただき、議論に付き合っていただきました。ありがとうございました。なお、文責はすべて私 (nhiroki) にあります。誤りや補足、質問などは気軽に GitHub Issue もしくは Twitter へお寄せください。 更新履歴 2018/01/15 Layout
Bundle Preloading があれば Module Declarations って要らなくないか？と思ったがそんなこともないらしい 5 日目と同じように、ちょっとだけ Web の未来のことを考えます。 Module Declarations とは Stage 1 のプロポーザルです。前は Module Fragments と呼ばれていました。提案されたタイミングに解説記事を書いたのでよければそちらも参照してください。当時とは構文や細かい挙動がやや異なりますが、根本的に解決したい課題は変わっていません。 https://sosukesuzuki.dev/posts/stage-0-module-fragments/ Module Declarations はモジュール内モジュールの宣言を可能にします。具体的には、次のような構文でモジュール内に新しいモジュールを宣言できます。 modu
最近の Prettier 開発の計画です。まだ何もやってないけど。 Prettier のサイズは大きい Prettier は npm パッケージのサイズが大きいことで有名です。 Prettier 2.8.1 のサイズ(11.6MB) Prettier のパッケージサイズが大きい理由はビルド方法にあります。 Prettier では、依存しているライブラリをすべてリリース時にビルド(バンドル)して Prettier の npm パッケージに含めています。 このあたりは Prettier のビルドの珍しいところで、リポジトリのルートに存在する package.json を見ると大量のパッケージが dependencies と devDependencies に含まれているのですが、実際に npm のレジストリに publish されるときの package.json の dependencies
Whilst the trend is seemingly to rewrite every JavaScript build tool in other languages such as Rust or Go, the current JavaScript-based tools could be a lot faster. The build pipeline in a typical frontend project is usually composed of many different tools working together. But the diversification of tools makes it a little harder to spot performance problems for tooling maintainers as they need
アドベントカレンダー飽きてきて文章が適当になってきている気がする。 概要 ESTree とは JavaScript の AST の仕様です。 https://github.com/estree/estree で Markdown として管理されています。 AST を表現する独自の構文(README では AST Descriptor Syntax として説明されている)を使って、JavaScript の各構文の AST の形を定義しています。 たとえば ArrayExpression (配列リテラル) の定義はこのようになっています。 interface ArrayExpression <: Expression { type: "ArrayExpression"; elements: [ Expression | null ]; } 1 行目の <: は implements のような意
大きめのテーマです。もしかしたら「うちでは書いた JS をそのまま配信してるぜ〜」って人もいるかもしれないでが。 最近の Web フロントエンド開発では、書いた JavaScript をそのまま動かさないことが多い 最近のフロントエンド開発ではエンジニアが書いた JavaScript をそのままブラウザで動かすことはほとんどないかもしれません。 例として最近流行のフレームワークを考えてみましょう。Next.js や Remix、Nuxt.js など、いずれも内部的にトランスパイラやモジュールバンドラを使い、エンジニアが書いた JavaScript を別の形へと変換してからユーザーのブラウザで動かすような仕組みになっています。 一昔前だと Next.js のようなフレームワークが今ほど発展していなかったこともあり、webpack や Babel を直接使っていたと思いますが、それも同じです。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
