Fantasmith Documentation
website·Indexed 30 days ago
https://fantasmith.comA technical knowledge base covering front-end development, React optimization, and computer science fundamentals. Topics include CSS stacking contexts, JavaScript closures, the Observer pattern, Big O notation, and practical guides for Storybook, ESLint Flat Config, and ThorVG.
What's inside Fantasmith
- DDara is a group project developed during the 9th Naver Boostcamp. The project focused on 'technical challenges' by prioritizing custom implementations over the use of existing APIs or libraries. The development cycle spanned 6 weeks, with 3-4 weeks dedicated to active development, followed by a period of autonomous refactoring.
Overview of ThorVG Vector Graphics Library
ThorVG is a lightweight, open-source vector graphics library designed for creating vector-based scenes and animations. It follows a "Simpler is Better" philosophy to provide high performance with a compact footprint and minimal overhead, particularly excelling in Lottie animation support.Overview of HDCP 2.2 Security Protocol
HDCP (High-bandwidth Digital Content Protection) is a hardware-level security protocol developed by Intel to prevent the illegal copying of high-resolution digital content (such as 4K/8K). It ensures that encrypted data remains secure from the source (e.g., a computer's graphics card) to the destination (e.g., a monitor). For HDCP to function, every component in the connection chain—including the graphics card, cable, monitor, operating system, browser, and drivers—must support the protocol. If any link in the chain is unsupported, the system is deemed insecure, and high-resolution playback is blocked. HDCP 2.2 specifically utilizes public-key encryption to provide the speed and efficiency required for real-time decryption of high-bitrate 4K content.Overview of Storybook
Storybook is a frontend workshop tool used for building UI components and pages in isolation. It allows developers to create, test, and document components independently from the main application logic, providing a dedicated environment for visual feedback and design system management. It is often compared to Swagger, but for frontend UI components instead of backend APIs.Overview of the Algorithms and Data Structures Guide
This guide provides a structured approach to learning algorithms and data structures, focusing on conceptual understanding and the ability to explain these topics to others. The guide uses JavaScript and Kotlin for examples, but the core concepts are language-agnostic.Overview of ThorVG Vector Graphics Library
ThorVG is a lightweight, open-source vector graphics library designed for creating vector-based scenes and animations. It follows a "Simpler is Better" philosophy to provide a compact footprint and minimal overhead while maintaining high performance, particularly in Lottie animation support.Overview of the AI Coach System
The AI Coach system is designed to overcome personal stagnation and burnout by implementing a structured growth loop based on measurable goals, daily feedback, and automated task generation. The system aims to act as a digital coach that helps users define concrete objectives and track progress visually to recover self-esteem and build capabilities.Overview of the Algorithms and Data Structures Guide
This guide provides a structured approach to learning algorithms and data structures, focusing on conceptual understanding and the ability to explain these concepts to others. The guide uses JavaScript and Kotlin for examples, but the core principles are language-agnostic.Overview of Storybook for UI Development
Storybook is a frontend workshop tool used to build UI components and pages in isolation. It allows developers to create, test, and document components independently from the main application logic. Key benefits include:
- Isolated Development: Develop components without running the entire application.
- Visual Feedback: Real-time rendering of components with various props and states for immediate feedback.
- Documentation: Serves as a living documentation for components, aiding in the creation of design systems and improving team collaboration.
Overview of React Lab research topics
React Lab is a technical exploration series focused on mastering React to a 'Maintainer' level. It covers four primary areas of study:
- React Principles: Exploration of why React was created, the problems it solves, and the core technical principles of the React ecosystem.
- Open Source Analysis: Detailed analysis of the actual React source code to understand the relationship between theoretical principles and practical implementation, as well as open-source project structures.
- Custom React Implementation: Building a custom version of React from scratch to compare with the official open-source implementation and analyze internal behaviors.
- Library Development: Developing applications using various React libraries to explore practical implementation patterns, such as applying animations during component unmounting and efficient global state management.
Introduction to Big O Notation
Big O Notation is a mathematical representation used to describe the performance or complexity of an algorithm. It focuses on the growth rate of the complexity as the input size (n) approaches infinity.
Common Big O complexities ordered from most efficient (fastest/smallest) to least efficient (slowest/largest) are: O(1) < O(n) < O(n²) < O(2ⁿ)
Overview of HDCP (High-bandwidth Digital Content Protection)
HDCP is a hardware-based security protocol designed to prevent the illegal copying of high-resolution digital content (such as 4K or 8K video) as it is transmitted from a source device to a display.
Unlike software encryption, HDCP operates at the hardware level. It ensures that the entire connection chain—including the graphics card, cables, monitor, operating system, browser, and drivers—supports the protocol. If any component in the chain is unsupported or fails the security check, the system will block high-resolution playback to prevent security vulnerabilities.