genealogy of front end technologies
TRANSCRIPT
GENEALOGY OF FRONT END TECHNOLOGIES
Invention of Web with HTML as its publishing language
● Tim felt the need of enabling researchers from remote sites in the world to organize and pool together information.
● He suggested to actually link the text in the files themselves.● This idea leads to the invention of Web,● For linking documents together by using buttons on the screen
hypertext is used.
Invention of HTTP
● For this Tim developed his own simple protocol - HTTP(HyperText Transfer Protocol) - for retrieving other documents' text via hypertext links.
● The text format for HTTP was named HTML, for HyperText Mark-up Language.
WHY HTTP?
● To reduce the inefficiencies of the FTP protocol.● Goal was fast request-response interaction● Two seperate TCP connections is established in FTP whereas only
one connection is required in HTTP.● HTTP doesn't require the control-channel to be maintained at the
server or client, so is stateless and simpler to implement.
HTML is based on SGML
● The HTML that Tim invented was strongly based on SGML.● HTML have hypertext links which is not present in SGML.● The idea of using the anchor element with the HREF attribute was
purely Tim's invention.
Invention of Mosaic Browser
● Tim's ideas had caught the eye of researchers of University of Illinois at Champaign-Urbana.
● After realizing the importance of Web, they decided to develop a browser which is called as Mosaic.
JAVASCRIPT
● When the World Wide Web was first created in the early 1990s all web pages were static.
● Netscape was the first to bring out a programming language that would allow web pages to become interactive - they called it Livescript and it was integrated into the browser.
● Upon receiving a trademark license from Sun, the name JavaScript was adopted.
Style sheets for HTML documents begin to take shape
● Bert Bos, Hakon Lie, Dave Raggett, Chris Lilley and others from the World Wide Web Consortium and others met to discuss the deployment of Cascading Style Sheets.
● Cascade defines the order of precedence for how conflicting styles should be applied.
● Initialy the focus was completely towards facilitating websites.● As the penetration of internet went so deep in human lives Web
Applications have become as common as websites in our routine life.● Currently the interface for internet is mainly browsers; it tends to
change slowly; mobile applications is just one possibility.
Websites - Defined by its content
Web Application - Defined by its interaction with the user.
Browser Environment
JavaScript
Document frames
location
history
XML HTTP Request
Object
Array
Function
DOMBOM
ECMAScript
DOM
● A programming API for documents that was extended for use in HTML.
● Originated to allow JavaScript scripts to be portable among Web browsers.
● Maps out an entire page as a hierarchy of nodes.
● Programmers can add, modify, or delete elements and content.
Example<html>
<head>
<title>Sample Page</title>
</head>
<body>
<p>Hello World!</p>
</body>
</html>
HTML
HTML
HEAD
HTML
TITLE
Sample Page
BODY
P
Hello World
BOM
● Allowed access and manipulation of the browser window.● e.g change current URL, do background requests to server with
XMLHttpRequest etc.
How Browser Works?
HTML CSS
DOMTree
Render Tree
JavaScript
Intearction
THANK YOU