Shopify/react-native-skia

Features

• Cross-Platform Graphics Frameworks - Provides a high-performance drawing system for hardware-accelerated visuals and animations across mobile and web platforms.
• 2D Rendering Engines - Provides a high-performance 2D graphics engine for rendering complex vector shapes and visuals via Skia.
• Custom UI Animations - Provides a toolkit for executing high-performance animations and transitions directly on the UI thread.
• Custom Shader Programming - Enables authoring and compiling of custom shader code to generate programmatic visual patterns within native apps.
• Composite Path Construction - Constructs complex vector paths using linear segments and Bezier curves for custom visualizations.
• Path Stylization Effects - Supports modifying path geometry to create dashed lines, rounded corners, and other stamped patterns.
• Vector Graphics Renderers - Functions as a vector graphics engine for drawing complex paths and shapes with advanced paint effects.
• JSON Animation Rendering - Loads and renders Lottie animations exported from After Effects as JSON specifications.
• Visual Effect Shaders - Compiles custom GLSL/SkSL shader code with parameterized uniforms to generate complex pixel-level effects.
• Shader Filter Applications - Implements a pipeline for applying custom shaders, blurs, and color matrices to visual elements.
• SVG Path Rendering - Renders 2D shapes using standard SVG path notation or programmatic builder objects.
• C++ Callback Bindings - Provides high-performance C++ native bindings to connect JavaScript calls to the underlying Skia graphics engine.
• Runtime Property Modifiers - Updates visual attributes like colors, opacity, and transforms at runtime during active playback.
• Native Thread Animation Engines - Executes animation logic on the native UI thread to ensure jank-free, high-performance transitions.
• Vector Fill and Stroke Styles - Defines colors, blend modes, opacity, and stroke properties to control the appearance of 2D shapes and paths.
• Declarative Component Architectures - Maps React components to graphics engine drawing commands through a declarative hierarchical tree structure.
• UI Animations - Provides a toolkit for creating fluid motion effects and 3D transformations executing directly on the UI thread.
• Layer-Based Motion Effects - Implements visual transitions and filters using a layer-based system to modify the final rendered output.
• Drawing Operation Layers - Allows applying image filters, such as blurs, to a captured set of drawing operations via a layer property.
• Backdrop Filtering Effects - Implements backdrop filtering to blur or distort the area behind graphical elements for glassmorphism effects.
• Dynamic Vector Visualizations - Supports building custom charts and progress indicators using precise path drawing and real-time interpolation.
• Dynamic Color Filters - Applies real-time color filters, blend modes, and linear interpolations to graphics layers.
• Immediate Mode Canvas Renderers - Implements an immediate mode API that executes drawing operations every frame for complex animations.
• Graphic Element Grouping - Groups drawing operations to apply collective transforms, clipping, and paint properties.
• Text Rendering - Renders paragraphs of text using custom or system fonts with support for custom painting and filters.
• UI Masking Layers - Provides masking layers to hide portions of drawings based on transparency or luminance.
• Image Filters - Processes pixel colors to create visual effects by composing filters like blurs and color matrices.
• Image Graphics Rendering - Draws images into specified areas using configurable fitting and sampling methods to control scaling.
• Image Processing and Manipulation - Implements advanced image processing including Gaussian blurs, color matrices, and backdrop filters.
• Lottie Players - Loads and renders high-performance 2D vector animations exported from After Effects in Lottie JSON format.
• Hierarchical Paint Effects - Adds shaders, image filters, and path effects to shapes through a hierarchical component structure.
• View Integrations - Provides the bridge for embedding a high-performance graphics surface within native platform views.
• Blur Effects - Provides Gaussian blur filters to soften the edges of graphical objects for various visual effects.
• Animation Slot Replacement - Swaps predefined placeholders in designs with dynamic content to customize animations without recreating them.
• Color Blending - Calculates smooth color shifts by interpolating between multiple color values.
• Layer-Based Filter Composition - Groups drawing operations into temporary buffers to apply filters and blurs to entire resulting images.
• Transform Animations - Interpolates spatial and geometric properties over time to create 3D transformations and fluid motion.
• Immediate-Mode Rendering - Supports an immediate-mode rendering paradigm that executes drawing commands every frame for complex animations.
• Offscreen Rendering - Allows drawing graphics to non-visible memory buffers to generate snapshots and image files.

Star history