前端小誌 (Front-end Notes)

website·Indexed 30 days ago

https://ernieyang09.github.io/learning-site

A personal knowledge base and blog by Ernie Yang covering front-end development topics such as JS, CSS, Redux dev tools, and AWS, as well as a learning site featuring LeetCode solutions focused on backtracking and dynamic programming (DP).

Tokens
92.3K
Snippets
304
Records
442
Agent score
75%

What's inside 前端小誌

  1. Overview of the OSI Model Layers

    The OSI model defines seven layers of network communication, each with specific responsibilities:

    • Layer 7 (Application): Handles protocols like HTTP, FTP, and SMTP.
    • Layer 6 (Presentation): Prepares data for the application layer.
    • Layer 5 (Session): Creates communication channels (sessions) between devices.
    • Layer 4 (Transport): Breaks data into segments; uses protocols like TCP and UDP.
    • Layer 3 (Network): Responsible for packet forwarding and routing using network addresses (IP).
    • Layer 2 (Data Link): Handles moving data into and out of physical links; acts as the bridge between software and hardware (MAC, Switches).
    • Layer 1 (Physical): Manages physical cabling or wireless connections (Cables, Hubs).
  2. Understand the role of Hash Functions in blockchain

    A hash function is a mathematical function that takes an input of any size and produces an output within a fixed range of numbers. In blockchain, secure hash functions are critical for ensuring that transactions cannot be modified once they are stored in the ledger.
  3. Understand and use Immediately Invoked Function Expressions (IIFE)

    An IIFE (Immediately Invoked Function Expression) is a JavaScript function that executes immediately upon definition. It is primarily used to:

    1. Avoid polluting the global namespace by encapsulating variables.
    2. Execute asynchronous functions immediately.
    3. Implement the module pattern.
    4. Create a local scope (block scope) for variables.
  4. Understand Relational Database Management Systems (RDBMS)

    RDBMS organize data into structured tables with predefined schemas using rows and columns. Each table represents an entity, and relationships between these entities are managed through keys. A common example of an RDBMS is MySQL.
  5. Understand Thunks and Lazy Evaluation in JavaScript

    A thunk is a subroutine used to delay a calculation until its value is actually needed. In JavaScript, which uses 'call by value' (eager evaluation), thunks are used to implement lazy evaluation. This allows a developer to wrap an expensive or conditional calculation in a function, preventing it from executing until the function is explicitly called.

    This concept is the foundation for redux-thunk, which allows the delaying of a dispatch call.

  6. Compare SOAP and REST scalability

    REST is more scalable than SOAP due to its stateless and layered architecture. This allows requests to be passed to other servers or handled by intermediaries, such as Content Delivery Networks (CDNs). SOAP is more challenging and expensive to scale because it requires applications to store state between requests, increasing memory and bandwidth requirements.
  7. Understand Asymmetric Encryption (Public Key Cryptography)

    Asymmetric encryption uses a pair of keys: a public key and a private key. A message encrypted with a public key can only be decrypted by the corresponding private key, and vice versa. This eliminates the need for secure key distribution and allows for better scalability in large networks, though it is slower in performance and more complex to implement than symmetric encryption due to larger key sizes.
  8. Understand the role of a WebRTC Signaling Server

    WebRTC facilitates peer-to-peer (P2P) communication. Because peers do not initially know each other's network locations, they must first connect to a Signaling Server to negotiate the connection. Once the negotiation is complete and peers have exchanged necessary information, they establish a direct P2P connection, bypassing the signaling server for the actual media transmission. The signaling server can be implemented using various protocols, such as HTTP or WebSockets.
  9. Understand and identify Cross-Site Scripting (XSS) triggers

    Cross-Site Scripting (XSS) allows attackers to inject malicious scripts into web pages viewed by other users. These scripts execute in the victim's browser, enabling attackers to steal information, impersonate users, or deface websites. XSS can be triggered automatically through various vectors, such as using the onerror event handler on an invalid image source or utilizing the javascript: pseudo-protocol within an iframe.
    <!-- Trigger via onerror event -->
    <img src="not_exist" onerror="alert(1)">
    
    <!-- Trigger via pseudo protocol -->
    <iframe src="javascript:alert(1)"></iframe>
  10. Understand JavaScript Execution Context

    An Execution Context is the environment in which JavaScript code is executed. It determines the value of this, available variables, and methods during execution. There are three types of Execution Contexts:

    1. Global Execution Context: The default environment (e.g., the window object in browsers).
    2. Functional Execution Context: Created whenever a function is invoked.
    3. Eval: Created when using the eval() function (rarely used).

    When functions are invoked, they are pushed onto the Execution Context Stack (also known as the Call Stack).