タグ

2024年12月8日のブックマーク (7件)

  • ニコニコ生放送のアプリケーションにRspackを導入している話

    この記事はニコニコ生放送のフロントエンドのアプリケーションにRspackを導入にあたって直面した問題やその解決策について時系列でまとめたものです。 以前書いた既存のアプリケーションに Rspack を導入しようとして失敗した話の記事と重複するところもありますが、記事を書いた時点では達成できなかった番環境での実践投入を果たすにあたって新たな試行錯誤もあったのでリライトという形で記事を書いています。 why Rspack? ニコニコ生放送のフロントエンドではWebpackを利用して成果物を生成しているのですが、ビルドの遅さによって開発体験が悪化しており、その改善策を模索していました。 問題の改善策として、以前にViteを導入することで開発時のビルド速度の改善を試みたことがあったのですが、css modulesのcomposesという機能で読み込んだscsscssとして取り扱われてしまう問

    ニコニコ生放送のアプリケーションにRspackを導入している話
    efcl
    efcl 2024/12/08
    webpackからrspackへの移行について。 css modules周りのいくつかの動作の問題があるが、ほとんどの部分でwebpackと互換性がある状態でbundleのパフォーマンスが改善できたという話
  • ECMAScript proposal updates @ 2024-12

    efcl
    efcl 2024/12/08
    2024年12月のTC39ミーティングでのECMAScript Proposalのステータス変更のまとめ。 Sync Importsの追加、`Error.isError`がStage 3に、`Intl.DurationFormat`がStage 4となるなど
  • React v19 – React

    React 19 is now stable! Additions since this post was originally shared with the React 19 RC in April: Pre-warming for suspended trees: see Improvements to Suspense. React DOM static APIs: see New React DOM Static APIs. The date for this post has been updated to reflect the stable release date. In our React 19 Upgrade Guide, we shared step-by-step instructions for upgrading your app to React 19. I

    React v19 – React
    efcl
    efcl 2024/12/08
    React 19リリース。 非同期遷移を扱うアクションの概念の追加と`useActionState`/`useFormStatus`/`useOptimistic`/`use` APIの追加。 react-domにprerender APIの追加、Server ComponentとServer Actionの追加。 `ref`をpropsとして渡す際に`forwardRef`は不要に、Hy
  • 改めて学ぶ satisfies 演算子

    TSKaigi Advent Calendar 2024の9日目の記事となります。 皆さんは普段TypeScriptのsatisfies演算子を使っていますか?私はswitch文の最後をnever型で終える際に、1行で記述するために使っていました。 type Role = "admin" | "user"; const getRoleText = (role: Role) => { switch (role) { case "admin": return "管理者"; case "user": return "ユーザー"; default: // もし将来Role型に新しい値が追加された場合、この部分でコンパイルエラーが発生 return role satisfies never; } }; const getRoleText = (role: Role) => { switch (rol

    改めて学ぶ satisfies 演算子
    efcl
    efcl 2024/12/08
    TypeScriptの`satisfies`演算子の使い方について
  • NoInfer<T>の活用例見つけた - Qiita

    こんにちは。この記事は株式会社カオナビ Advent Calendar 2024の3日目の記事です。 NoInfer<T> 皆さんは、TypeScriptの機能であるNoInfer<T>をご存知でしょうか。これはTypeScript 5.4から追加された新機能であり、おおよそ次のようなものです。 型としてはNoInfer<T>はTと同じだが、型推論に違いがある。 NoInfer<T>のT部分に型変数が含まれている場合でも、T部分は型推論に使われない。 NoInfer<T>は主にジェネリック関数の引数の型として使われる。 TypeScript 5.4のリリースノートではNoInfer<T>の例として次のようなものが紹介されていましたので、改めて解説します。 function createStreetLight<C extends string>(colors: C[], defaultCol

    efcl
    efcl 2024/12/08
    NoInferのユースケース
  • STORES全体の技術課題の意思決定をするSystem Design Meetingについて - STORES Product Blog

    こんにちは、うしろのこです。STORES アドベントカレンダーの1日目ということで、当は別の内容を書く予定だったんですがリリースの都合などもあり、今回は STORES における System Design Meeting という会議体について書こうと思います。 System Design Meeting とは System Design Meeting は、STORES 全体に関わるような技術的な課題について議論し、意思決定をする場です。ミーティングのオーナーはCTOが担当し、基的には持ち込みで技術課題を共有して全体の方針決めから実行までの合意を取ることになります。 誰でも参加可能かつ誰でも持ち込み可能なので、ボトムアップで直接CTOやシニアマネージャーへ相談しに行けるのも大きなメリットです。現在STORES アプリケーションが様々な基盤を通して繋がっている状況で、自然と影響範囲の広い

    STORES全体の技術課題の意思決定をするSystem Design Meetingについて - STORES Product Blog
    efcl
    efcl 2024/12/08
    "System Design Meeting は、STORES 全体に関わるような技術的な課題について議論し、意思決定をする場です。"
  • Mongoose の callback を Promise に移行する手法

    Developer Experience & Performance チームでエンジニアをしている大矢です。今回は JavaScript の非同期処理で使われている callback を Promise に移行する手法について、具体的な事例をもとに紹介します。 背景 プレイドでは MongoDB Atlas という MongoDB のマネージドサービスを使っており、クライアントライブラリにはほとんどのシステムで Mongoose を使用しています。 MongoDB Atlas では2025年7月に MongoDB 6.0 が EOL になるため、MongoDB 7.0 にバージョンアップする必要があります。また、そのためには Mongoose のバージョンを 6.x から 7.x に上げる必要があります。 6.x から 7.x にアップデートする際に最も大きく変更が必要だったのは drop

    Mongoose の callback を Promise に移行する手法
    efcl
    efcl 2024/12/08
    Npde.js CallbackからPromiseへの移行