クリーム色の背景、色付き表示、高コントラスト、大きな文字のほうが読みやすいですか?配色と文字を選ぶと、すべてのページに一度で反映されます。

無料レッスン

Webアプリの部品のつながり

このレッスンのあとで: 簡単な Web アプリの部品がどうつながるかを、図に描くことができます。

45分のレッスンコマンドなし

朝7時のクーポン

あるコンビニチェーンのアプリでは、毎週月曜日の朝7時に新しいクーポンが出ます。その瞬間、数十万人が一度にアプリを開きます。

先月、その時間に画面が30秒も止まりました。どこを直せばよいかを話し合うには、まず部品のつながりを図にする必要があります。

このレッスンのゴール

メモ

簡単な Web アプリの部品がどうつながるかを、図に描くことができます。

キーワード

ことばいみれい
クライアント人が使う画面の側です。スマホのアプリ
サーバーリクエストに答えるコンピューターです。
データベースデータをずっと保存しておく場所です。
キャッシュよく使う答えを置く、速い一時置き場です。
キューあとでする仕事を並べておく列です。
ワーカーキューの仕事を一つずつ片づけるプログラムです。

学生が入力するセルは、このプレビューでは空白です。

基本は三つの部品

ほとんどの Web アプリは、三つの部品から始まります。

クライアントは、人が触る画面です。サーバーは、リクエストを受けて答えを作ります。データベースは、会員やクーポンのデータを保存します。

サーバーを再起動しても、データベースのデータは消えません。だから、大事なデータはデータベースに置きます。

キャッシュは同じ答えを速く返す

月曜日の朝、数十万人が同じ「今週のクーポン」を見に来ます。毎回データベースに聞くと、データベースが追いつきません。

そこで、一度作った答えをキャッシュに置きます。次の人には、キャッシュから返します。キャッシュはメモリにあるので、データベースよりずっと速いです。

ただし、クーポンが変わったら、キャッシュも消して作り直します。

例: キャッシュの効果

方法1回の答えにかかる時間1万回分の合計
毎回データベースに聞く50ミリ秒500秒
キャッシュから返す1ミリ秒10秒

学生が入力するセルは、このプレビューでは空白です。

よくある誤解

注意

「キャッシュがあれば、データベースはいらない」と考える人は多いです。キャッシュは一時置き場で、再起動すると中身が消えることがあります。もとのデータは、いつもデータベースにあります。キャッシュは、速くするための写しだと考えましょう。

時間のかかる仕事はキューへ

メールやお知らせを送るのは、時間がかかる仕事です。サーバーがその場で送ると、利用者は送り終わるまで画面の前で待たされます。

そこで、サーバーは「送る」という仕事をキューに置くだけにして、すぐ答えます。ワーカーという別のプログラムが、キューから仕事を取って、順に送ります。

授業で使いますか?このモジュールを学生に割り当てると、教員用ガイド、自動採点つきの課題、学生ごとのラボを使えます。