> For the complete documentation index, see [llms.txt](https://amartyushov.gitbook.io/tech/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://amartyushov.gitbook.io/tech/awesome/frontend.md).

# Frontend

## Browser

* [How browser rendering works ](https://blog.logrocket.com/how-browser-rendering-works-behind-the-scenes-6782b0e8fb10/)
  * [How web works](https://github.com/vasanthk/how-web-works)
    * Overview of how web page is opened (networking, rendering, etc)
  * [How browser works](https://developer.mozilla.org/en-US/docs/Web/Performance/How_browsers_work)
* [Chrome blog](https://developers.google.com/web/updates/2018/09/inside-browser-part1)
  * infinite amount of info. You need to find a proper topics
* [What happens when google search happens](https://github.com/alex/what-happens-when)
* [Good explanation of CORS](https://dev.to/lydiahallie/cs-visualized-cors-5b8h)

## NPM

* [what is a cost of adding a npm package to the bundle](https://bundlephobia.com/)

## Landing pages

* [Good overview](https://www.disruptiveadvertising.com/landing-pages/landing-page/)
  * landing page constructor [unbounce.com](https://unbounce.com/product/landing-pages/)
  * landing page constructor [instapage](https://instapage.com/)

## Design

* [Apple design resources](https://developer.apple.com/design/resources/)
* [Designcourse Figma Handbook](https://drive.google.com/drive/u/0/folders/1L9D5Y-iCflR1IiYeaN-4Xgtoil7XSB4a)
* [Design resources for developers (fonts, logos and many more)](https://github.com/bradtraversy/design-resources-for-developers)

## Tools

* [Frontend developer hand book](https://frontendmasters.com/guides/front-end-handbook/2019/#6.40)
  * mostly about tooling of 2018/2019 year
* [JavaScript Visualizer 9000](https://www.jsv9000.app/)
* <https://vite.dev/>
  * a high-performance front-end build tool with fast hot-reloading