Next.jsのISRを独自に構築する ~ Cloudflare Workers編（Cache APIの注意点） ~
Next.jsにはIncremental Static Regeneration（以降: ISR）というレンダリングの仕組みが存在します。ところがこれを利用するにはVercel上でNext.jsを使用しないと完璧な動作をしないことは知られています。ですが、このISRの仕組みは従来のSSRよりサーバの処理コストはもちろん、キャッシュという仕組み上レスポンスにも非常に効果のあるものです。 今回はこのISRを独自に構築するための技術を記事として起こしていきます。 本記事の続きとなるものはこちらに記載しておりますので、合わせて御覧ください。 【前提条件】 ISRが何という説明は本記事では行いません。 システム構成上、1記事ですべてを説明するにはボリュームが大きいので複数記事に分けさせて頂きます。 本記事で詳細するシステム構成には一部成約が存在します。 使用するNext.jsもしくはそれに準ずるもの
高校生が作った有料サービスがちょっと儲かったのでいろいろ書く
Discordの有料読み上げBotを運営している高校3年生です。公開2年目で月に12kほど利益が出ています。 最大4つのボイスチャットで読み上げ可能 可用性99% Webダッシュボード などの機能があります。Discordを使っている方がいれば、ぜひ導入していただけるとうれしいです。 コミュニティの宣伝 未踏ジュニアに採択された採択者で、未踏ジュニアに挑戦したい方向けのコミュニティを始めました！約12人の採択者と話をしたり、質問できます！ぜひ共有していただけると幸いです🙏 なぜ作ることにしたのか？ 昔（4年前）頃から無料のDiscordの読み上げBotは存在していましたが、どれも使う人数が多すぎて制限があったり、読み上げが遅くなったりするという問題がありました。そこで、有料の読み上げBotを運営することにしました。 料金体系 一律で月500円/20万文字のサブスクリプションにしました。g
GKEでStreamlitをホスティングして社内用アプリを作った話 - エムスリーテックブログ
はじめに ブンブンハローテックブログ。エムスリー AI・機械学習チームでエンジニア兼YouTuberをやっています河合と笹川です*1。本記事は、AIチームが社内向けに提供を初めたビジュアライズアプリケーションに関する解説の記事です。 GKE上のStreamlitサーバのホスティング設定と、機械学習エンジニアが社内向けの可視化を行う際の一例として、参考となれば幸いです。 はじめに Background Streamlitとは Streamlitの特徴 アプリケーション、インフラ構成 おわりに We're hiring Background 一般的に「機械学習エンジニアが社内向けの可視化アプリケーションを作る」といったケースでは、以下のようなシステム利用が考えられるかと思います。 HTML、xlsx、Googleスプレッドシートなどを作成、配布する S3、GCSのようなストレージの静的サイトホ
OSS 版 API Gateway、Kong Gateway をつかってみる - Techtouch Developers Blog
バックエンドエンジニアの taisa です。テックタッチでは API Gateway として、AWS の API Gateway ではなく、クラウドでもオンプレでも使えるオープンソースの Kong Gateway を利用しています。この記事では Kong Gateway とは何か、なぜ使うのか、どうやって使うのか、を簡単にまとめてみました。 Kong Gatewayとは なぜ Kong Gateway を使うのか Kong Gateway をインストールできる環境 Kong Gateway の特徴 Kong Gateway の概念と機能 Kong Gateway のドキュメント Mac + DB Less（YML）環境で動かしてみる 構成 下準備 Kong をセットアップする kong.yml にサービスとルーティング情報を記述する Rate-Limit プラグインを利用する プロキシキャ
Goでインメモリキャッシュを取り扱う時にハマった話 - Gunosy Tech Blog
こんにちは、Gunosy Tech Labの片木（@jkatagi）です（普段はGunosyデータ分析ブログの方に生息しています）。 本記事では社内のとあるAPI（Go製）の改修をしていたときに遭遇したインメモリキャッシュの落とし穴について共有します。 普段からGoを書いている人にとっては当たり前のことかもしれませんが、アンチパターンとして共有できれば幸いです。 落とし穴にハマるGopherくん 要約 APIのアーキテクチャについて なにが起きたのか なぜ起こったのか 単体テストでは気づけなかったのか どう解決したか おわりに 要約 長くなるので最初に要約しますと 当該APIでインメモリキャッシュとして構造体のスライスを格納していた キャッシュしている値を変えてしまうとキャッシュ元も変わってしまう という事態が発生しました。 ですのでインメモリキャッシュを使う時は対象の値が変更されないこと
リモートのデータ取得のためのフックライブラリの SWR を使ってみる | メルカリエンジニアリング
こんにちは。Mercari Advent Calendar 2019 の 17 日目は Web UX Team 所属の @lightnet328 がお送りします。 どのようにリモートのデータを取得して管理するかは SPA 構成の Web フロントエンドにおいて大きなテーマの 1 つだと思います。最近では Apollo Client のようにデータ取得のためのクライアントとデータ管理のためのキャッシュ機構が一体化したライブラリが出てきています。 本稿で紹介する zeit/swr (以下、SWR) もそのような特徴を持っています。SWR はその名が示すとおり HTTP の stale-while-revalidate (略すと swr) というキャッシュ戦略に影響を受けているため、先に HTTP の state-while-ravalidate について紹介します。 HTTP の Cache-
GraphQL Caching について | Akamai Japan Blog
※本ブログに記載の情報は現在の製品、サービス、機能名称と異なる可能性がありますのでご注意ください</p>\r\n<h3>はじめに</h3>\r\n<p>GraphQL (Query Language)は、Facebookにより開発され、2015年にリリースされたAPI用のデータクエリ言語であり、REST APIの次のパラダイムとして益々注目されています。GraphQLの主な特徴として、クライアントが送出するAPIコールであるHTTP POST Bodyにサービスに必要なリソースを明示的に記述することで、過剰なAPIコール数の削減や、レスポンス内の余分な情報を無くすことでペイロードサイズの削減ができる点などがあげられます。また、基本的に単一のエンドポイントのみを利用すること、APIのバージョンという概念が存在しないことなどもGraphQLの特徴となります。</p>\r\n<p>REST AP
Reactの次期機能のSuspenseが凄くって、非同期処理がどんどん簡単になってた！ - Qiita
React17の次期新機能のSuspenseが凄い！ と思ったので少し学習していました！ Suspense自体の説明は下の動画がわかりやすいかも。 13:15ぐらいからプログラムのDemo 29:30ぐらいからSuspenseとはなんぞや、という説明をしてくれています。 Githubにdemoもあったので、実際に動かしてみたい方はこちらも是非是非 つまりSuspenseって何？ Suspenseっていう機能があるわけじゃないんです、すみません 概念というかなんといいますか 自分の意訳・解釈なので間違っていたら土下座しに行きます 外部APIからデータを取得・表示するような処理で使えるんですね。 読み込みを開始したらLoadingを出して、APIが戻ってきたらデータを表示してローディングを消して……っていう、reduxやsagaを使って今まで頑張ってきているものがあると思うんですね。 API実
Service Worker スクリプトのインストールと更新処理
Service Worker の実装が主要ブラウザで揃い始めて盛り上がってきましたね。その流れに便乗して久しぶりに Service Worker の仕様や実装に関する記事を書いてみました。今回は Service Worker スクリプトのインストールと更新処理についてです。 この記事は Service Worker スクリプトを少しでも手書きして動かしたことがある人を想定読者にしています。Service Worker について全く知らない人はまず別の入門記事を参照してください。また、細かいことを気にせずに Service Worker を使いたい人は Workbox といったライブラリやフレームワークの利用をおすすめします。 更新履歴 2019/09/24: Chrome 78 から importScripts() も更新対象になりました。それについて加筆しました。 2018/06/07:
Microservices at Mercari
1) Mercari has transitioned some services to microservices architecture running on Kubernetes in the US region to improve development velocity. 2) Key challenges in operating microservices include deployment automation using Spinnaker, and observability of distributed systems through request tracing, logging, and metrics. 3) The architecture is still evolving with discussions on service mesh and c
Foreign Fetch による Micro Service Workers | blog.jxck.io
Update Foreign Fetch は削除される方向で進んでいる。 別途エントリを上げたのでそちらを参照。 Foreign Fetch が削除されそうな理由と Cookie の double keying | blog.jxck.io Intro Service Worker に Foreign Fetch という機能が提案されている。 この機能があるとクロスオリジンへの fetch をフックできる Service Worker を、その対象オリジンから提供できるようになる。 一体どういう仕組みなのか、これによって何が可能になるのかについて、デモを交えて記す。 1st Party と 3rd Party 例えばこのブログであれば、筆者自身が Service Worker を登録することで、Push などの機能を提供することができる。 ここではこれを、1st Party の Servi
Java 9の新機能（予定）がオラクルから早くも発表に
今年の3月にJava 8が正式公開され、次のJava 9はおそらく2年後の2016年に登場すると予想されますが、そのJava 9に搭載される予定の新機能がオラクルから発表されたとInfoQの記事「Oracle Announces First Java 9 Features」が報じています。 InfoQが報じたJava 9の新機能は、JDK Enhancement Proposals（JEP）のインデックスページの中からバージョン9の予定になっているものとしても見つけられるようです。主なものをリストアップしました。 HTTP 2 Client HttpURLConnectionを置き換える予定で、HTTP 2.0とWebSocket対応 Light-Weight JSON API RFC7159に準拠したJSONデータの生成と読み込みを行うライトウェイトAPIを提供する Process AP
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
より速い WEB を目指す Next.js / nextjs-make-the-web-faster
MySQLアーキテクチャ図解講座