A web browser commonly known as browser
is a software application installed on a pc to allow
access to the internet. It displays the web pages from servers together with other files such as images,videos etc,
interprets and shows them on the screen. All you do
is input the URL (Universal Resource Locator) address of a webpage in the
address bar and the browser will display the web page on your pc screen.
1. User Interface: the space of interaction between users and the browser.Common inputs for user interface are - address bar, next and back buttons,home button, refresh and stop buttons etc.
Layout of a Browser
A browser’s basic function is to get files from a server and display them on the screen. It normally displays html files with images, PDF, videos etc in a structured layout. A
browser is a collection of blocks or lines code that performs numerous tasks of showing a webpage on the pc screen. These codes are arranged in to
different components according to their works they do. The layout
of a browser is shown in the below image.
1. User Interface: the space of interaction between users and the browser.Common inputs for user interface are - address bar, next and back buttons,home button, refresh and stop buttons etc.
2. Browser Engine: the block code that connects input from the user
interface to the rendering engine. It performs the work of querying and
manipulating the rendering engine in-accordance with inputs from various
user interfaces.
3. Rendering Engine: the part that performs the work of displaying the requested
content on the screen. It first parses the html tags and making use of the
styles, it constructs a render tree and finally a render layout that
displays the content on the screen.
4. Networking: the part of the code written in the browser, performing the function of sending numerous network calls. For example sending the http requests to a server.
5. Java Script Interpreter: the component of the browser compiled to interpret the java script code present in a web page.
6. UI Backend: it draws basic widgets on the browser like combo boxes, windows, etc.
7. Data Storage : the minute database created on the local drive of the pc where
the browser is installed. This database stores various files like
cache, cookies, etc.
How Web Browsers works?
World Wide Web based on the client-server model. A user pc works as a client which receives and sends data to the server. If a web page is
requested by a user, the browser contacts the server (where
the website is stored) and by getting and interpreting the requested
files, it shows the web page on the pc screen.
The entire procedure occur following three steps:
1. Contact to DNS Server : if a user enters a URL into the address bar and press ‘enter’, immediately the browser contacts the DNS server,which stores the IP
addresses of the server connected to the corresponding domain names.
The DNS server fetches the domain name from the browser and returns the associated IP address to the browser.
2. Contact to Server :After fetching the IP address of the server of the requested webpage, the browser sends a request to that server for the required files. For
example the following URL :
http://www.electro-adebayo.blogspot.com/how sonar works
The URL is split in three parts. First is HTTP
– a protocol known as Hyper Text Transfer Protocol which determines the manner the browser communicates with the server. Second is www.electro-adebayo.blogspot.com translated by the DNS server with the IP address. It is the
address of the computer (Web Server) where the requested web page is
stored. Third is ‘how sonar works’ which tells the address of the file that is stored in the root folder of the website.
HTTP
protocols are used to transfer the webpage known as ‘how sonar woks’ to the
browser. The protocol determines the format and the method of
communication between web client and server.
3. Rendering –
The whole process undergone by a browser beginning with fetching the webpage to
displaying it on the screen is known as Rendering. It is takes place in the
following steps:
a. Loading HTML
– As soon as the web page is located by the browser, it is fed in to
the browser using the http protocol. All html tags and other
resources (such as images, flash files etc) referred in the html tags
are loaded separately.
b. Parsing – An HTML Parser begins to interprete the html files and building subsequent content tree.
c. Apply Styles
– Web pages also have style sheets attached to them and a web browser possesses
its default styles. Using a CSS parser, they are interpreted so as to
define the styles (like height, width, spacing, border, color, margin,
etc.) for the content in the specified html.
d. Construct Frames
– With the help of HTML and style sheets, the browser constructs the frames. A
frame is a rectangular block that possesses numerous properties like width,
height, color, spacing, etc.
e. Frames
Layout– This process includes arranging all frames in sequence to form
a layout of the web page.
f. Frames Painting–
As the layouts are being constructed,the next stage is painting.
Painting is the word to denote the process to exactly render the objects
on the screen,after which the webpage is displayed on the pc
screen. A browser undergoes all the processes in a flash of a second.
Major Web Browsers
Comments