In order to fulfill the basic functions of our service, the user hereby agrees to allow Xiaomi to collect, process and use personal information which shall include but not be limited to written threads, pictures, comments, replies in the Mi Community, and relevant data types listed in Xiaomi's Private Policy. By selecting "Agree", you agree to Xiaomi's Private Policy and Content Policy .
Agree

Tech

[News] [ Tech Class #6 ] What is browser engine and how does it work?

2019-07-21 21:37:00
229 6

Hello Mi Fan's!!!

A web browser is a software application for accessing information on the Internet. Each individual web page, image, and video is identified by a distinct Uniform Resource Locator (URL), enabling browsers to retrieve these resources from a web server and display them on a user's device.

When you choose a web browser, you’re also choosing a browser engine and a rendering engine - sometimes these two terms are used separately and sometimes to mean the same thing.

What is a browser engine?

A browser engine is a core software component of every major web browser. The primary job of a browser engine is to transform HTML documents and other resources of a web page into an interactive visual representation on a user's device. The engine combines all relevant CSS rules to calculate precise graphical coordinates for the visual representation it will show on the screen. To complete the process, the engine makes the necessary system calls.

The browser engine is to take the HTML, CSS and other code of a web page - the text you can see in the page source or open in a text editor, setting out layouts, page content, and styling - and convert it into what you actually see on screen.

Technically, the rendering engine renders pages and the browser engine handles comms between the rendering engine and the browser user interface. The browser engine, rendering engine, and JavaScript engine are all essentially working together to get raw web code into a viewable and usable-form inside your browser.

Browser engines may be used in other types of programs besides web browser.

Multiple browser engines

because of the web platform is aset of open standard, there are multiple browser engine implementations.

Gecko-It's a Mozilla's browser engine. It's used in the Firefox web browser, the Thunderbird email client, and the SeaMonkey internet suite. Goanna also is a fork of Gecko used in the Pale Moon browser.

Webkit-This engine created by Apple for its Safari browser, by forking the KHTML engine of the KDE project.

Google also used WebKit for its Chrome browser, but eventually forked it to create the Blink engine.

Blink engine-All Chromium-based browsers use Blink, as do applications built with CEF, Electron, or any other framework that embeds Chromium.

Trident and Edge HTML-Microsoft formerly developed its own proprietary browser engines - Trident and EdgeHTML, though now uses Blink for its Edge browser.

Servo-It's an experimental browser engine developed to take advantage of the memory safety properties and concurrency features of the Rust programming language. The project was initiated by Mozilla Research with an effort from Samsung to port it to Android and ARM processors.

How does browser engine work?

In some ways the engine is like a translator, turning the raw code that you can’t understand into a beautifully laid out page of text and graphics that you can.

The browser engine makes choices about how to interpret what a web developer has typed, in-fact, how particular lines of code affect what’s on screen. The browser engine is the most important part of the browser. Browser engines are the main reason that web pages sometimes look, load, and work differently in different browsers. As well as existing web standards, browser engines also need to support new standards as the internet gets ever-more complex.

  • The data that makes up a web page is lots of things, but it’s mostly broken down into 3 parts:
  • code that represents the structure of a web page
  • code that provides style: the visual appearance of the structure

code that acts as a script of actions for the browser to take: computing, reacting to user actions, and modifying the structure and style beyond what was loaded initially The browser engine combines structure and style together to draw the web page on your screen, and figure out which bits of it are interactive. It all starts with structure.

When a browser is asked to load a website, it’s given an address. At this address is another computer which, when contacted, will send data back to the browser. This data is sent back in a format called HTML, and it describes the structure of the web page.

Browser engines contain special pieces of code called parsers that convert data from one format into another that the browser holds in its memory.

The in-memory structure of the web page is called the Document Object Model, or DOM. As opposed to a long piece of text, the DOM represents a tree of elements of the final web page: the properties of the individual elements, and which elements are inside other elements. The HTML also includes addresses where styles and scripts can be found. When the browser finds these, it contacts those addresses and loads their data.


Once the browser engine has computed styles, it’s time to put it to use! The DOM and the computed styles are fed into a layout engine that takes into account the size of the window being drawn into. The layout engine uses various algorithms to take each element and draw a box that will hold its content and take into account all the styles applied to it.

When the layout is complete, the engine turns the blueprint of the page into the part you see. This process is known as painting, and it is the final combination of all the previous steps. Every box that was defined by layout gets drawn, full of the content from the DOM and with styles from the CSS. The user now sees the page, reconstituted from the code that defines it.

Google's search engine is a powerful tool, but the internet is a big place. It's sometimes hard to find what you're looking for. Google can help narrow down what you're looking for with specialized searches. You can browse through the different categories that pertain to your keywords. It uses a special algorithm to determine its search results. It also uses automated programs called spiders or crawlers, just like most search engines, to help generate its search results. Google has a large index of keywords that help determine search results.

Google also uses a trademarked algorithm called PageRank, which assigns each Web page a relevancy score. The best way to make sure your Web page is high on Google's search results is to provide great content so that other sites will link to your page. The more links your page gets, the higher its PageRank score will be. If you attract the attention of sites with a high PageRank score, your score will grow faster.

Conclusion:This helps Google remain competitive with other search engines and reduces the chance of someone finding out how to abuse the system.

Source's--✍️

I hope you all understand what a browser engine is, if you have any questions or suggestions, please ask me in the comments section below!  We always love hearing from you guys

Rate

Number of participants 1 Experience +20 Pack Reason

View Rating Log

2019-07-21 21:37:00
Favorites3 RateRate

Semi Pro Bunny

SriramSrikrishna | from Redmi Note 4

#1

Nice thanks for your information
2019-07-21 23:18:01

Grand Master Bunny

Ian Adoe | from Redmi Note 5A

#2

nice explanation, thanks
2019-07-22 00:59:36

Advanced Bunny

shaunmoroz | from Redmi Note 7

#3

Let's go, Blink! Can't wait to try Microsoft's Edge browser based on Chromium!
2019-07-22 01:15:25
thanks for the info
2019-07-22 10:47:31
Thanks for sharing this guidance
2019-07-23 14:32:50
Thanks for sharing this guidance
2019-07-23 14:35:27
please sign in to reply.
Sign In Sign Up

ᎮᏒᎥᏁፈᏋ

News Reporter

  • Followers

    221

  • Threads

    982

  • Replies

    2020

  • Points

    25011

Check-in 3 jours
Check-in 7 jours
Check-in 21 jours
Check-in 40 jours
Check-in 70 jours
Check-in 100 jours
10k
New Home
10k Mi Fans
Redmi Note 7
Cast Away
20K Mi Fans
30K Members
Mi Love U & I
Limited Edition Space Medal
Bunny Winner
20K Mi Fans
Mi 9 & Mi 9 SE
70K Fans
Android Q
2 años
Mother's Day
Día de las Madres
Best Mi
Happy Mother's Day
Android Q
50K Mi Fans
Mobile Photography Lover
X-MEN. Desata tu poder
25K
Favorite X-Men
Medalla X-Men: Bestia
Medalla X-Men: Cíclope
X-Men: Mística
Medalla X-Men: Magneto
70K Mi Fans
Challenger
40K Registered Users
Eid Mubarak
Eid ul-Fitr Mubarak
Brain Teaser
X-Men Favorite Medal
Perfil Personalizado
80K Mi Fans
200k Member
Tech Talent
Orgullo
100K Mi Fans
Selfie Day
50K Users
Mi 9T
Medalla Mi Community
MIUI Geek
Fortune 500
Fortune 500
Three's A Party
Happy July
Mi 9T
Global Fans
My Country My Pride
Redmi 7A
Fortune Global 500
FORTUNEGLOBAL500
Mi 9 SE
60K Registered Users
Like
Check in
Reply
Favorites
Post
FortuneGlobal500
Profile Medal
Eid Al-Adha Mubarak
9YearsWithMIUI
Fortune Global 500
MIUI 9th Birthday
Global Community
70K
У які ігри ви граєте найбільше?
Global Community
Mejor Contenido Agosto
Mi A3
80K Medal
Medalla Encuesta Mi Phone
80K
wallpaper votes
500
Redmi 7A
better together slogan
Global Community
device poll
better together with friends
games discuss
Puzzle Master
Mid-Autumn Festival

Read moreGet new
Copyright©2016-2019 Xiaomi.com, All Rights Reserved
Content Policy
Quick Reply To Top Return to the list