質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
HTTP

HTTP(Hypertext Transfer Protocol)とはweb上でHTML等のコンテンツを交換するために使われるアプリケーション層の通信プロトコルです。

Q&A

1回答

800閲覧

HTTPリクエスト状況分析の読み方について

yukikp

総合スコア797

HTTP

HTTP(Hypertext Transfer Protocol)とはweb上でHTML等のコンテンツを交換するために使われるアプリケーション層の通信プロトコルです。

0グッド

0クリップ

投稿2019/05/27 07:36

編集2022/01/12 10:55

いつもお世話になっております。

ある人から、ウェブサイトの表示が遅いから見てくれないかと頼まれ、ChromeのDevToolsのNetworkタブを使ってどれくらい遅いのか、何が原因なのか見てみようと思いました。

その結果が添付の写真です。
(注目してもらいたい部分だけ切り抜き)
イメージ説明

お聞きしたい事は、赤枠で囲んだNameの部分がドメインとなっている2つのアイテムです。

後者は、Typeがtext/htmlということでhtmlのテキストデータなのかなと思ったのですが、前者はTypeがdocumentということですが何を指しているのでしょうか。

訂正:そもそも、text/htmlがhtmlのテキストデータならば、htmlのテキストデータのTTFBより前に、style.css が読み込まれるだなんておかしな話なので、この考え方も違ってそうですね。

この二つのアイテムはいったいそれぞれ何を表しているのでしょうか?

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

CHERRY

2019/05/27 07:48

ページがわからないので推測ですが...  iframe かなにか使われていますか?
yukikp

2019/05/27 07:55

>ページがわからないので推測ですが...  具体的なサイトをここに書くのははばかられるので、申し訳ありません。 >iframe かなにか使われていますか? 今ソースを見てみたら、確かにiframeがJavaScriptで埋め込まれてました。 なるほど。ダミーサイトで、iframeを入れたページを作って計測してみます。
yukikp

2019/05/27 08:10

今、自分のサーバー上で、自分を再帰的にiframeで呼び出すhtmlを作ってみました。 確かに、Nameとしては同じものが2つ表示されるのですが、Typeは両方ともdocumentなんですよね。。。
mar-kn

2019/05/27 08:55

Group by frame にチェックを入れれば、iframe部分をグルーピングして表示してくれるので、少しわかりやすくなるかと思います。 赤枠の前者はおそらく表示されているページ自体のソースだと思うのですが、後者はクリック(または右クリック)すると何が表示されるのでしょうか。
CHERRY

2019/05/27 15:19

うちの環境で確認してみると 拡張子のないファイルと 拡張子に MIMEタイプが登録されていないファイルが、 text/html になっていますね。
yukikp

2019/07/08 23:41

mar-knさん、CHERRYさんありがとうございました。 今回はiframeではなく、CHERRYさんがおっしゃっていた拡張子にMIMEタイプが登録されていないファイルでした。
guest

回答1

0

それぞれのアイテムをクリックした後に、HeadersとResponseのそれぞれのタブから通信内容を確認することが出来るので、それで確認するのが確実です。

イメージ説明

もしくは、アイテム上で右クリック→Open in New tab で新しいタブで開いて確認するか。(これは上記に比べると正確な結果にならない場合があり余す)

投稿2019/05/27 16:43

tanat

総合スコア18709

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

yukikp

2019/07/08 23:49

tanatさんありがとうございました。 今回は、拡張子にMIMEタイプが登録されていないファイルでした。ありがとうございました!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問