LoginSignup
1
0

ブラウザがどう動いているかについて調べてみた

Posted at

はじめに

ブラウザがどのように動くか気になったため、
以下の記事を読んでみて勉強になったことについてこの記事に書き残そうと思います。
How Browsers Work - Behind the Scenes of Modern Web Browsers

ユーザーインターフェース

ブラウザの戻るボタン等、ユーザーインターフェースはどのブラウザでも一緒なので使用等があるのかと思っておりました。
以下の文章から、使用があるわけではなく良いユーザーインターフェースが残った結果、どのブラウザでも統一されたようです。

the browser's user interface is not specified in any formal specification,
it just comes from good practices shaped over years of experience and by browsers imitating each other.
The HTML5 specification doesn't define UI elements a browser must have, but lists some common elements

パース

ブラウザがコードをパースする際はLexicalとSyntaxの2つのパースが実行されるようです。
Lexicalは意味をなす最小単位に分解する。
Syntaxはコードの文法通りとなっているかを解析すると読み取りました。

Parser - Lexer combination
Parsing can be separated into two sub processes: lexical analysis and syntax analysis.
Lexical analysis is the process of breaking the input into tokens. Tokens are the language vocabulary: the collection of valid building blocks. In human language it will consist of all the words that appear in the dictionary for that language.
Syntax analysis is the applying of the language syntax rules.

ブラウザのエラー寛容度

自分もhtmlを書いている際にシンタックスエラーが発生しないなとは思っていましたが、やはりHTMLでエラーは発生せず、ブラウザ側で修正しているようです。

You never get an "Invalid Syntax" error on an HTML page. Browsers fix any invalid content and go on.

パースの順所について

ブラウザは同期的に処理しておりscriptがある場合はscriptに到達した瞬間に実行、外部から参照している際は取得されるまでパースは止まるようです。
ただし非同期でパースする仕組みがHTML4以降でdefer属性を使うことで可能になっているようです。

The model of the web is synchronous. Authors expect scripts to be parsed and executed immediately when the parser reaches a

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0