GraphQLのダイエット術 TypeScript Language Service Pluginで未使用フィールドをなくす
はじめに GraphQLは、API開発において柔軟性と効率性を提供する強力なツールです。しかし、クエリの記述が自由な分、クライアント側で不用意に多くのフィールドを要求してしまうと、パフォーマンス低下や保守性の悪化につながる可能性があります🥲 本記事では、TypeScript Language Service Pluginの1つであるGraphQLSPを活用し、GraphQLクエリの"ダイエット"、つまり未使用フィールドの削減を実現する方法を紹介します。 ※ この記事はTSKaigi Kansai 2024で共有した内容を記事にしたものです。 GraphQLの課題と対策 over fetching問題 GraphQLは、クライアントが厳密に必要とするデータのみを要求できるため、REST APIに比べてオーバーフェッチによるパフォーマンス低下を抑えることができます✊しかし、GraphQLでも
Next.js+TypeScriptでシンプルなニュースサイトを作ってみた。 - Qiita
作ったもの タイトルはSimple Newsです。 サイトURLは、 **こちら**です。 ソースコードは **こちら**です。 Google News を参考にしました。 どんな機能があるの？ NewsAPIからニュースサイトの記事のデータを取得し、タイトルと画像を表示 NewsAPIは、世界中のニュースサイトから検索をかけて、情報を取得できるAPI ( Application Programming Interface ) OpenWeatherMapから取得した、現在の天気情報と5日間の天気予報を表示 OpenWeatherMapは、現在の気象やある期間の気候の予測データを取得できるAPI ページ遷移が高速 記事をクリックすると、記事が掲載されているサイトへ飛びます。 こんな感じでとてもシンプルで高速に動くニュースサイトです。 こんな人に読んでほしい Next.jsを使ってみたい初心
イベント用の名札シート印刷アプリ「参加者の名は。」を作った - エンジニアをリングする
こんなものを作ってみました。 yoshiko-pg.github.io ConnpassのイベントURLを入力してCreateボタンを押すと、名刺サイズの参加者の名札を印刷プレビューできるようになっています。 （主催するイベントがないけど動きを見てみたい場合、入力欄右下の「demo」を押すと雰囲気がわかるかと。） 右下の印刷ボタンで印刷できます。 管理者や補欠者もお好みで含めることができます。 背景 カンファレンスや勉強会って、普段ネット上でしか知らない人と直接話せる機会でもあると思うのですが、いざその場で顔や名刺を見ても誰が誰かわからないんですよね。。 SNSではよく見るけど顔がわからなくて、でも話したいことがあるときとか、頭の上にアイコンとIDが表示されるメガネがほしい・・・ってたびたび思ったりします。 そんな思いから、自分がスタッフとして関わっているイベントではアイコンとIDの入った
チャットワークの、これからのフロントエンド戦略 | チャットワーククリエーターズブログ
こんにちは！ChatWork CTOの山本です。 チャットワークのバックエンドをPHPからScalaへの切り替えることを決断し、現在は移行に向けての大プロジェクトが進行中です。 バックエンドはScalaにしていく。じゃあフロントエンドはどうするの？ということで、今回はチャットワークのフロントエンド開発における今後の戦略を書いてみようかと思います。 現在のフロントエンドにおける課題現在のJavaScriptコード量は、ざっと5万行ほどになっています。(OSSライブラリ、言語キーなどを除く。たぶん大規模・・ですよね？) 約5年前の開発スタート時より、素のJavaScriptとjQueryをベースにゴリゴリと書き重ねられ、これぐらいのコード規模になったソースコードはご想像通りメンテナンスコストがかなり高くなってしまっています。。。 バックエンドの刷新に伴い内部APIも一新されるため、どうせ大幅に
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
