baeharam/Must-Know-About-Frontend

Features

• Frontend Engineering Curricula - Provides a comprehensive study guide covering browser internals, network protocols, and critical rendering paths for frontend engineering.
• Frontend Engineering Studies - Acts as a comprehensive study guide for frontend engineering, covering browser rendering and engine mechanics.
• Layout Techniques - Serves as a study guide for mastering the CSS box model and modern layout systems.
• Web API and Browser Standards - Serves as a reference for leveraging native browser capabilities and Web APIs.
• JavaScript Execution Contexts - Explains how JavaScript manages execution contexts and the call stack during code execution.
• JavaScript Engine Internals - Offers detailed technical explanations of how JavaScript engines parse and execute code.
• Language Internals Guides - Offers educational deep dives into JavaScript closures, prototypes, and the event loop.
• JavaScript Language Instruction - Provides educational deep dives into the core specifications and behaviors of the JavaScript language.
• JavaScript Language References - Details internal JavaScript mechanisms such as execution contexts, closures, and the event loop.
• Web Browser Internals - Explains the internal architecture of web browsers, focusing on the critical rendering path.
• JavaScript Engine Internals - Describes the internal pipeline of parsing source code into ASTs and applying JIT optimizations.
• Lexical Scope Resolution - Details how the JavaScript engine resolves variables using lexical scope and the scope chain.
• Web Security - Explains fundamental web security concepts used to protect applications from common browser-based attacks.
• Web Application Security - Provides a deep dive into protecting web applications from XSS, CSRF, and Same Origin Policy violations.
• Web Security Analysis - Analyzes common web vulnerabilities including XSS, CSRF, and the Same Origin Policy.
• Lexical Scoping - Explains the language mechanism of lexical scoping to create persistent environments and closures.
• Box Model Sizing - Explains the critical distinction between content-box and border-box sizing in the CSS box model.
• Semantic Markup Standards - Provides guidance on using semantic HTML and proper document types for better structure and compatibility.
• Grid Layout Systems - Provides a comprehensive guide to implementing structured page layouts using CSS Grid and Flexbox.
• Critical Rendering Paths - Provides a deep dive into the critical rendering path, including DOM and CSSOM construction.
• Browser Rendering Pipelines - Details the browser rendering pipeline and the creation of the render tree for layout and painting.
• DOM Manipulation - Covers the manipulation of the document object model to programmatically change elements and text.
• Box Model Tutorials - Teaches the CSS box model, including the interaction between content, padding, borders, and margins.
• Script Loading Strategies - Details strategies for managing JavaScript execution and download timing using async and defer attributes.
• CSS and Styling - Serves as a technical reference for CSS layout systems and browser style normalization.
• Declarative Transition Animations - Guides the implementation of basic transitions and movements using declarative CSS and compositor threads.
• Application Key-Value Stores - Explains the use of browser-based key-value storage for persisting application state on the client side.
• Frontend Build Pipelines - Provides an overview of automated sequences for bundling, transpiling, and optimizing web assets.
• Module Bundling - Describes the process of merging multiple source files into a single bundle to improve load speed.
• Frontend Build Pipelines - Covers the fundamentals of frontend build pipelines, including module bundling and transpilation.
• Network Protocol Tutorials - Explains the fundamental workings of HTTP/S, REST APIs, and the lifecycle of a URL request.
• Hoisting Explanations - Provides educational explanations of how variable and function declarations are hoisted in JavaScript.
• Hardware-Accelerated Animations - Provides detailed guidance on using GPU acceleration to achieve high-performance UI animations and smooth state changes.
• V8 Bytecode Compilation - Covers the compilation of JavaScript into V8 bytecode and just-in-time optimizations.
• Host and Native Objects - Explains the difference between language-defined native objects and environment-provided host objects.
• Abstract Syntax Tree Parsing - Explains how JavaScript engines parse source code into abstract syntax trees for optimization.
• DOM Event Propagation Control - Details how to manage event bubbling and capturing phases within the browser DOM.
• Browser Style Resets - Details techniques for resetting default browser styles to create a blank slate for custom design.
• Browser Style Normalizers - Covers the use of CSS normalization libraries to ensure consistent element rendering across browsers.
• Display Mode Definitions - Analyzes the differences between CSS block, inline, and inline-block layout behaviors.
• Element Centering - Explains various techniques for aligning UI components both horizontally and vertically using Flexbox, Grid, and absolute positioning.
• Element Stacking - Teaches how to manage the visual stacking order of elements using the z-axis and positioning.
• Legacy Float Layouts - Covers the use of CSS float properties and techniques to prevent parent container collapse.
• Floating Layouts - Explains how to manage floating layouts and isolate text from floating elements using formatting boundaries.
• Image Alignment Fixes - Provides specific CSS fixes to eliminate default baseline gaps that appear below images.
• Margin Collapsing Behaviors - Describes how vertical margins collapse and provides methods to prevent this behavior.
• Asynchronous Script Loading - Describes the use of async and defer strategies to prevent JavaScript from blocking the render path.
• Formatting Contexts - Teaches how to create new formatting contexts to isolate elements and prevent vertical margin collapsing.
• Element-Linked Data Stores - Covers the use of data attributes to attach custom, private data to DOM elements for script access.
• Event Delegation - Explains the event delegation pattern using bubbling to manage multiple child elements with one listener.
• Modern Web Syntax Transpilation - Covers the conversion of modern JavaScript syntax into versions compatible with older browsers.
• Rendering Strategies - Provides a technical analysis of the trade-offs between different web page rendering strategies.

Star history