サクサク読めて、
アプリ限定の機能も多数！
アプリで開く
Previous slideNext slideToggle fullscreenOpen presenter view TS特化Clineプログラミング mizchi / tskaigi 2025 mizchi: パフォーマンスチューニングの傭兵 一ヶ月で御社のプロダクトをコスパよく高速化しますフロントエンド視点のE2Eチューニング(Lighthouse) CI/CD 高速化 (Linux,GitHub Actions) New プロンプトエンジニアリングでワークフロー自動化 主な環境VSCode + RooCode (ほぼ常に Orchestrator モード) Claude 3.7 + Gemini 2.5 (約2~3万円/月)TypeScript / Node /Deno /Cloudflare あらすじ 2014: なぜ仮想DOMという概念が俺達の魂を震えさせるのか
生SQLを扱う $queryRawTypeScript向けのORMライブラリとしてPrismaがあります。Prismaは直感的で型安全なAPIを提供し、TypeScript向けのORMとしては第一に名前が上がることが多いライブラリです。 しかしそんな人気なPrismaでも、裏側では少しクセのあるSQLが発行されていたり、欲しいSQLがPrismaのAPIでは実現できない場合があります。 そういった場合のために $queryRaw というメソッドが用意されており、これを使うことで生SQLを書いてその結果を受け取ることができました。他のORMにもよくある機能です。 例えば以下のように実装することができます。 const users = await prisma.$queryRaw` SELECT id, name FROM "Users" WHERE id = ${userID} `; co
タイトルのこともできることを検証した。（ORM で文句ない人はORM として使えばいい） Prisma はTypeScript の優秀なORM / QueryBuilder だが、Prisma 以外で運用されていると途中から投入するのが（一応可能ではあるが）面倒だったりする。 だが TypedSQL によって、既に存在するDBに対して、副作用なくクエリビルダとしてのみ導入することができるのでは、と思いついて試したところ、できた。 今回はリモートの Supabase の PostgreSQL に対して行ったが、たぶん他の環境にも使える。 d1 とか。 prisma の最小プロジェクトのセットアップ $ mkdir prisma-qb-only $ cd prisma-qb-only ## 初期化 $ pnpm init $ pnpm add prisma @prisma/client
TypeScript 4.9 から、satisfies operator が使えるようになりました。従来のas constと組み合わせ、型チェックと widening 防止を同時に行えます。筆者的には、"顧客が本当に必要だったもの"です。本記事では satisfies とは何か？ as const とは何か？ 2つを組合わせるとどのようなメリットがあるのか？ について、実際のコードと共に解説します。 結論TypeScriptで 定数を export する場合は、as const satisfies を設定しておくと便利です。 export const myName = "田中" as const satisfies string; export const foodList = { ramen: "ラーメン", udon: "うどん", soba: "そば" } as const sa
この記事は、静的解析とビルドサイズ面で興味深いテーマでした。記事として自分の考えを書きます。 注意。あくまでビルドパフォーマンス視点での最適化です。強い意図があって、自分のドメインモデリングの方法論ではこれが最適なんだ、というなら元コードの方法論を止めるつもりはありません。 元記事のコードを minify するとどうなるか 元コードを参考に、それにアクセスするサンプルコードを書いてみます。 const sortingOptions = { priceDesc: { id: "priceDesc", sort: "price", order: "desc", label: "価格が高い順", }, priceAsc: { id: "priceAsc", sort: "price", order: "asc", label: "価格が安い順", }, ratingDesc: { id: "ra
はじめに この記事では、Widening(型の拡大) の対となる Narrowing(型の絞り込み) について解説します。 Narrowing は多くの記事や解説において 型ガード (type guard) と呼ばれる用語に基づいて解説されますが、Narrowing のキーワードで包括的に解説するのが公式ドキュメントでも行われているやり方です。 実際、型ガードよりも対概念である『Widening(型の拡大)』や『型の集合性』などを加えて Narrowing として考えた方がそれぞれについてよりスッキリと理解することが可能になります (特に判定可能なユニオン型などについてはそうです)。 型集合 おさらいとなりますが 前回の記事 では、型は以下の図 (fig 1) のように具体的な値の集合であると解説しました。単位型 (Unit type) である具体的な値から作られるリテラル型の集合によって
Matt PocockMatt is a well-regardedTypeScript expert known for his ability to demystify complexTypeScript concepts. tsconfig.json scares everyone.It's a huge file with a TON of potential options. But really, there are only a few configuration options you need to care about. Let's figure them out, and cheatsheet them. #The Package This article is so popular that I'vebundledits recommendations i
Recently, I had to convert a union type into an intersection type. Working on a helper type UnionToIntersection<T> has taught me a ton of things on conditional types and strict function types, which I want to share with you. I really like working with non-discriminated union types when I try to model a type where at least one property needs to be set, making all other properties optional. Like in
npm package を作る度にイチから開発環境の構築をしていて大変だったので、自分専用のテンプレートリポジトリを作りました *1。github.com せっかくなので、テンプレートの特徴とか、どういうこと考えながら作ったとか紹介してみます。 はじめに: 基本的な技術スタック npmTypeScript Node.js Native ESM Prettier ESLint VitestRenovateGitHub Actionsvscode 向けの各種設定ファイル (extensions.json, launch.json, settings.json)GitHub の「テンプレートリポジトリ」機能を使うGitHub にそれっぽい機能があったので使ってみました。 docs.github.com 「Use thistemplate」というボタンが出て便利です。 「Use t
TypeScriptの型情報を使って、サポート対象のブラウザが実装してないメソッドの利用をエラーにするESLintルール eslint-plugin-typescript-compatはTypeScriptプロジェクト向けのESLintルールです。 このESLintではサポートしているブラウザが、実装していないメソッドを検知してLintエラーにしてくれます。JavaScriptではメソッドの静的解析は難しい(メソッド名が同じでも独自実装の可能性があるため)ですが、TypeScriptの型情報を使って静的解析をしています。 サポートしている機能 [ ]JavaScriptのビルトインオブジェクト [x] プロトタイプメソッド Array.prototype.find [x] 静的メソッド Array.from [ ] オブジェクト Promise [ ] DOMAPI 基本的にメソッド
Simplifying serverless best practices with AWS Lambda Powertools for TypeScript | Amazon Web ServicesAWS ComputeBlogSimplifying serverless best practices withAWSLambda Powertools forTypeScript Thisblog post is written by Sara Gerion, Senior Solutions Architect. Development teams must have a shared understanding of the workloads they own and their expected behaviors to deliver business value fast and with confidence. TheAWS Well-Architected Framework andits Serverless Lens provide architec
Node.js で環境変数を参照するためのオブジェクト process.env の型情報は、@types/node で次のように文字列型ディクショナリ Dict<string> として定義されています。 node_modules/@types/node/process.d.ts（抜粋） declare module "process" { global { var process: NodeJS.Process; namespace NodeJS { interface ProcessEnv extends Dict<string> {} //... } } export = process; } この型定義は @types/node モジュールをインストールするだけで簡単に使用できるようになるのですが、具体的なキー名（環境変数名）が定義されていないので、Visual Studio Cod
fullstack TSなアプリケーションも増えてきた昨今、TSでvalidatorを実装する際に何を採用するかは一大トピックです。今回は、その中でも新しめなライブラリでありBlitzも採用しているZodについて見ていきます。ZodとはZodの特徴として、Schema firstなvalidationライブラリであるというのがあります。 validateするschema（単一のschemaからobject, arrayまで）を定義し、それをベースにparseするというものです。 公式にあるexampleを見てみましょう。 import { z } from "zod"; //creating a schema for strings const mySchema = z.string(); mySchema.parse("tuna"); // => "tuna" mySchema.p
何番煎じかわかりませんがTypeScript でのエラーハンドリングについて考えてみたいと思います。 この記事で扱うTypeScript のバージョンは 4.3 です。 エラーを型安全に扱いたいTypeScript を書いていれば誰もが一度はぶつかる問題ではないでしょうか。TypeScript では catch した例外は any として扱われます。 これはJavaScript の仕様上どんな値でも throw できてしまうため仕方のないことなのですが、せっかく型安全性を手に入れるためにTypeScript を使っているのに any をハンドリングしなければならないのは苦痛です。 次のように例外を throw し得る関数 foo() のエラーハンドリングを考えてみます。 e は any なので、プロパティにアクセスしようにも危険性が伴います。 そこで型アノテーションを使用して
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
