# Learn web browsers
> A web browser (commonly referred to as a browser) is a software application for retrieving, presenting, and traversing information resources on the World Wide Web. An information resource is identified by a Uniform Resource Identifier (URI/URL) and may be a web page, image, video or other piece of content. Hyperlinks present in resources enable users easily to navigate their browsers to related resources. Although browsers are primarily intended to use the World Wide Web, they can also be used to access information provided by web servers in private networks or files in file systems. - Wikipedia
##### The [most commonly used browsers](http://www.sitepoint.com/browser-trends-april-2015-statcounter-vs-netmarketshare/) (on any device) are:
- [Chrome](http://www.google.com/chrome/) (engine: [Blink](https://en.wikipedia.org/wiki/Blink_(layout_engine) + [V8](https://en.wikipedia.org/wiki/V8_(JavaScript_engine))
- [Safari](https://www.apple.com/safari/) (engine: [Webkit](https://en.wikipedia.org/wiki/WebKit) + SquirrelFish)
- [FireFox](https://www.mozilla.org/en-US/firefox/new/) (engine: [Gecko](https://en.wikipedia.org/wiki/Gecko_(software) + [SpiderMonkey](https://en.wikipedia.org/wiki/SpiderMonkey_(software))
- [Internet Explorer](#) (engine: [Trident](https://en.wikipedia.org/wiki/Trident_(layout_engine) + [Chakra](https://en.wikipedia.org/wiki/Chakra_(JScript_engine))
![](https://box.kancloud.cn/2015-10-19_5624560db34a3.png "http://gs.statcounter.com/#all-browser_version_partially_combined-ww-monthly-201408-201508-bar")
image source: [http://gs.statcounter.com/#all-browser_version_partially_combined-ww-monthly-201408-201508-bar](http://gs.statcounter.com/#all-browser_version_partially_combined-ww-monthly-201408-201508-bar)
##### The most commonly used headless browser are:
- [PhantomJS](http://phantomjs.org/) (engine: [Webkit](https://en.wikipedia.org/wiki/WebKit) + SquirrelFish)
- [slimerjs](http://slimerjs.org/) (engine: [Gecko](https://en.wikipedia.org/wiki/Gecko_(software) + [SpiderMonkey](https://en.wikipedia.org/wiki/SpiderMonkey_(software))
- [TrifleJS](http://triflejs.org/) (engine: [Trident](https://en.wikipedia.org/wiki/Trident_(layout_engine) + [Chakra](https://en.wikipedia.org/wiki/Chakra_(JScript_engine))
##### How browsers work
- [20 Things I Learned About Browsers and the Web](http://www.20thingsilearned.com/en-US/foreword/1) [read]
- [How Browsers Work: Behind the scenes of modern web browsers](http://www.html5rocks.com/en/tutorials/internals/howbrowserswork/) [read]
- [Fast CSS: How Browsers Lay Out Web Pages](http://dbaron.org/talks/2012-03-11-sxsw/master.xhtml) [read]
![](https://box.kancloud.cn/2015-10-19_5624560dc890d.png "http://www.html5rocks.com/en/tutorials/internals/howbrowserswork/")
image source: [http://www.html5rocks.com/en/tutorials/internals/howbrowserswork/](http://www.html5rocks.com/en/tutorials/internals/howbrowserswork/)
##### Optimizing for browsers:
- [Website Performance Optimization](https://www.udacity.com/course/website-performance-optimization--ud884) [watch]
- [Browser Rendering Optimization](https://www.udacity.com/course/browser-rendering-optimization--ud860) [watch]
##### Browser security
- [Browser Security Handbook](https://code.google.com/p/browsersec/wiki/Main) [read]
- [HTML5 Security Cheatsheet](https://html5sec.org/#javascript) [read]
- [Frontend Security](https://mikewest.org/2013/09/frontend-security-frontendconf-2013) [watch]
- [Security for Web Developers: Using JavaScript, HTML, and CSS](http://www.amazon.com/Security-Web-Developers-Using-JavaScript/dp/1491928646/ref=sr_1_11) [read][$]
- [The Tangled Web: A Guide to Securing Modern Web Applications](http://lcamtuf.coredump.cx/tangled/)[read](#)
##### Comparing browsers
- [Comparison of web browsers](https://en.wikipedia.org/wiki/Comparison_of_web_browsers) [read]
##### Developing for browsers
In the past, a front-end developer spent a lot of time making code work in several different browsers. This was once a bigger issue than it is today, unless you have to write code for older browsers (i.e. <IE8). This still remains an issue today, just not one that demands so much of the front-end developers time and brain cycles. The fact of the matter is modern abstractions (e.g. jQuery, SASS) have done away with a lot of browser inconsistency issues.
##### Evergreen browsers
The latest versions of browsers are considered evergreen browsers. That is, they automatically update themselves silently without prompting the user. This move towards self updating browsers has been in reaction to the slow process of eliminating older browsers that are very complicated to develop for given their deviations from the commonalities between browsers.
##### Picking a browser
As of today, most front-end developers use Chrome and the tools available to a developer, "Chrome Dev Tools". However, all of the browsers offer a flavor of developer tools. Picking one to use for development is a subjective matter. The more important issue is knowing which browsers you have to support and testing in each as you develop. Select whichever browser makes sense to your brain and gets the job done. I suggest using Chrome.
##### Evolution of browsers & technologies (i.e. api's)
- [www.evolutionoftheweb.com](http://www.evolutionoftheweb.com/) [read]
- [Timeline of web browsers](https://en.wikipedia.org/wiki/Timeline_of_web_browsers) [read]
##### Browser hacks
- [browserhacks.com](http://browserhacks.com/) [read]
- Introduction
- What is a front-end developer?
- Part I: The front-end practice
- Front-end jobs titles
- Common web tech employed
- Front-end dev skills
- Front-end devs develop for...
- Front-end on a team
- Generalist myth
- Front-end interview questions
- Front-end job boards
- Front-end salaries
- How FD's are made
- Part II: Learning front-end dev
- Self directed learning
- Learn internet/web
- Learn web browsers
- Learn DNS
- Learn HTTP/networks
- Learn web hosting
- Learn general front-end dev
- Learn UI/interaction design
- Learn HTML & CSS
- Learn SEO
- Learn JavaScript
- Learn DOM, BOM & jQuery
- Learn web fonts
- Learn accessibility
- Learn web/browser API's
- Learn JSON
- Learn front-end app architecture
- Learn Interface/API design
- Learn web dev tools
- Learn command line
- Learn node.js
- Learn module loader
- Learn package managers
- Learn version control
- Learn build & task automation
- Learn site performance optimization
- Learn JS testing
- Learn headless browsers
- Learn offline dev
- Learn security
- Learn multi-thing dev (e.g. RWD)
- Directed learning
- front-end schools, courses, & bootcamps
- Front-end devs to learn from
- Newsletters, news, & podcasts
- Part III: Front-end dev tools
- General front-end dev tools
- SEO tools
- Prototyping & wireframing tools
- Diagramming tools
- HTTP/network tools
- Code editing tools
- Browser tools
- HTML tools
- CSS tools
- DOM tools
- JavaScript tools
- App (desktop, mobile, tablet etc..) tools
- Templating tools
- UI/widget tools
- JSON tools
- Testing framework tools
- Data storage tools
- Module/package loading tools
- Module/package repo. tools
- Web/cloud/static hosting tools
- Project management & code hosting
- Collaboration & communication tools
- CMS hosted/API tools
- BAAS (for front-end devs) tools
- Offline tools
- Security tools
- Tasking (aka build) tools
- Deployment tools
- Site/app monitoring tools
- JS error monitoring tools
- Performance tools