azukiazusa.dev

#JavaScript

Hono で Server-Sent Events によるストリーミングを実装する

Server-Sent events（SSE）は、サーバーからクライアントに向けてイベントをストリーミングするための仕組みです。WebSocket と比較すると、サーバーからの単方向の通信、HTTP で通信するという特徴があります。この記事では Hono を使って OpenAI API を使ったテキスト生成をストリーミングする方法を紹介します。

Svelte v5 で導入された Runes によるリアクティビティシステム

Svelte v5 で導入された Runes によるリアクティビティシステムについて解説します。従来の Svelte は純粋な JavaScript のコードのみを使用してリアクティビティを実現していましたが、アプリケーションが大規模になると複雑性が増すという問題がありました。Runes は Svelte のリアクティビティシステムをより柔軟にし、アプリケーションの規模が大きくなってもシンプルさを保つことを目指しています。

Chrome の組み込み AI の Summarization API を試してみる

Google では大規模言語モデル（LLM）などの AI モデルをブラウザに直接統合するように設計された、Web プラットフォーム API とブラウザ機能を開発しています。これには Gimini Nano という AI モデルが含まれており、デスクトップパソコンにおいてローカルで実行されるように設計されています。この記事では Summarization API を使用して、文章を要約してみます。

Scoped Custom Element Registries でカスタム要素の名前衝突を防ぐ

Web Components を利用してアプリケーションを構築する際に、異なるコンポーネントライブラリが同じ名前のカスタム要素を定義していると、名前の衝突が発生します。Scoped Custom Element Registries を使用すると、同じページの異なるスコープで同名のカスタム要素に別々の実装を登録できます。この記事では Scoped Custom Element Registries について紹介します

あの日見たaxiosの機能を僕達はまだ知らない。

axiosは、JavaScriptにおけるHTTPクライアントのデファクトスタンダードといえるでしょう。 Promiseベースで非同期通信を行えるHTTPクライアントとして、ブラウザ標準のfatchやjQuery.ajaxなどがありますが、特にaxiosがよく使われているのには豊富なオプションや設定に理由付けられるでしょう。 axiosの機能について私のように詳しくなくても直感的にHTTPリクエストを送れるのも良い点の1つですが、せっかくなのでaxiosでどのようなことができるのがを見ていきましょう。

すぐに使える！JavaScriptの華麗な配列操作

JavaScriptで配列操作をする際には、まずはJavascriptが持つ配列のメソッドを眺めて見るとよいでしょう。JavaScriptはライブラリに頼らなくとも自前で高度な操作を可能にしてくれます。 組み込みの配列メソッドはたくさんありますが、その中で私がよく使うメソッドを紹介します。

URL が有効かどうかを判定する `URL.canParse()` メソッド

`URL.canParse()` メソッドは与えられた URL 文字列が有効であるかどうかを判定します。URL 文字列が有効であれば `true` を、無効であれば `false` を返します。これは URL コンストラクターを用いた `try...catch` 文による判定よりも簡潔に記述できます。