ホームページ > ウェブフロントエンド > htmlチュートリアル > URL を入力してからページを読み込むまでの間に何が起こるのでしょうか? _html/css_WEB-ITnose

URL を入力してからページを読み込むまでの間に何が起こるのでしょうか? _html/css_WEB-ITnose

WBOY
リリース: 2016-06-24 11:47:06
オリジナル
905 人が閲覧しました

この質問はよくある質問ですが、Baidu のあちこちに回答がありますが、自分なりにまとめてみたいと思います。

今日では多くの答えがありますが、すべてキーボードの応答やタッチ スクリーンの応答などのハードウェアから始まり、CPU の処理から OS カーネルなどに至るまでです。ここでの焦点はここではありません。興味のある学生は、FEX というポータルを提供できます。URL の入力からページの読み込みが完了するまでのプロセスで何が起こりますか?

URL を解析する

まず第一に、多くのブラウザ、特に Chrome は前処理を行います。前処理とは、アクセスしようとしている URL を分析して、TCP リンクを確立するか、事前にレンダリングすることを意味します。ユーザー エクスペリエンスでは、URL を入力するとページがすぐに読み込まれます。Chrome が高速なエクスペリエンスを提供するのも不思議ではありません。

しかし、ブラウザに入力されたすべての文字列が有効な URL であるわけではありません。たとえば、ブラウザのデフォルトの検索エンジンを呼び出すために、アドレス ボックスに直接中国語の文字を入力したいことがあります。したがって、Enter キーを押すと、URL が事実上検証されます。 httpプロトコルに準拠していればWebに従って処理されます。

入力が完了すると、ブラウザはキャッシュを確認し、要求された情報に対応する変更を加えます。

HTTP リクエスト

  1. アドレスがドメイン名を通じてアクセスされる場合、最初に DNS を通じてアドレスを IP アドレスに解決します。もちろん、DNS にはキャッシュ、ブラウザ キャッシュ、OS キャッシュ、ルーター キャッシュ、ISP キャッシュもあります。見つからない場合は、成功するか失敗するまで再帰的に上位の DNS サーバーを検索し続けます。
  2. アドレスにポート番号が含まれていない場合、プロトコルに従ってポート番号がデフォルトで追加されます。たとえば、http プロトコルはポート 80 ですが、https プロトコルはポート 443 です。
  3. TCP 接続を確立し、HTTP リクエストを送信します。 Zhihu への訪問リクエストのスクリーンショットを撮ります。

    Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8Accept-Encoding:gzip, deflate, sdchAccept-Language:zh-CN,zh;q=0.8,en;q=0.6Cache-Control:no-cacheConnection:keep-aliveCookie:[key=value...]; Host:www.zhihu.comPragma:no-cacheUser-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/41.0.2272.104 Safari/537.36
    ログイン後にコピー
  4. サーバーはリクエストを受信すると、さまざまなリソースへのアクセス、キャッシュの有無、リクエスト方法などを含むリクエスト情報を解析します。データベースで分析および処理された後、アクセスしたいリソース ファイル (html、css、js、img など) が含まれた応答が返されます。

ブラウザ分析

比較的低レベルのコンピュータネットワークの作業が完了した後 (物理層とデータリンク層は基本的に議論されていませんでした、いいですか?!)、アプリケーション層のブラウザは大きな成果を上げ始めました。

まず、ブラウザは HTML、CSS、JS を解析し、DOM ツリーとスタイルをレンダリングし、Js を介してインタラクションやアニメーション効果を実装します。

そうすれば、美しいまたはリッチなアプリケーション Web を入手できます。

最後に書いてあります

実際、執筆プロセスは関連するレビューを経ており、ここに書かれていることは完璧ではありません。最下層は複雑なことをやりすぎているので、誤解を招かないようにどう書いたらよいのかわかりません。代表的で身近なものについてのみ書くことを選択できます。しかし、私の心の中にある感情は確かに非常に深いものです。コンピューター ネットワークは、階層構造とその中のさまざまなプロトコルの両方が、何世代にもわたって慎重に検討され、解決されてきたものです。

私たちの考えでは、私たちは英語の一部を入力しているだけですが、その背後には、大規模で複雑なブラウザ、ブラウザカーネル、オペレーティングシステム、コンピュータネットワークなどの一連の緊密に連携したものがあります。私たちの快適で豊かなインターネットライフは、各世代のエンジニアの努力と切り離せないものです。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート