Imp 0.0.2-alpha

Imp

Imp is a lightweight, sprite-based rendering framework for F#, supporting both OpenGL (desktop) and WebGL (web). Inspired by Elmish and React Native, it provides a declarative way to build high-performance 2D applications with a functional architecture.

🔹 Why "Imp"? The name comes from an Imp, a small mischievous creature—just similar to a sprite! Imp is designed to be a fast and lightweight sprite renderer for building graphical applications.

🚀 Try the demo: davidtme.github.io/imp

Features

• 🎮 Sprite-Based Rendering – Optimized for rendering 2D sprites efficiently.
• 🏗 Elmish-Like Architecture – Write declarative UI code, similar to React Native in F#.
• 🖥 Cross-Platform Support – OpenGL for desktop apps and WebGL for browser-based applications.
• 🎨 Declarative Scene Composition – Manage scenes and sprites with a structured, functional approach.
• 🚀 GPU-Accelerated Performance – Leverages OpenGL/WebGL for smooth, high-performance rendering.
• 📦 Web-Based & Local Asset Management – Load and manage textures, sprites, and other resources effortlessly.
• 💡 F#-First Development – Functional, type-safe, and expressive API.
• 🌐 Fable Integration – Uses Fable to compile F# to JavaScript for seamless web development.

Example Usage

With Imp, you can quickly set up a WebGL scene:

module Client.SimpleWeb.App

// Import required modules for application setup and rendering
open Imp
open Imp.Setup

// Define the name of the texture to be used in the application
let texture = "f-sharp-logo"

// Initialize a data manager for handling web-based data operations
let dataManager = WebDataManager(baseUrl = ".")
// Register the texture name with the data manager
dataManager.AddTextureName(texture)

// Define a function to create the main view of the application
let sampleView () =
 // The view function serves as the root container for the scene
 view () {
 // The sceneRenderer sets up the rendering environment, including the background color
 sceneRenderer (backgroundColor = { R = 29; G = 41; B = 61 }) {
 // The singleRenderer renders individual sprites one at a time
 singleRenderer () { 
 // Define a sprite with its position, dimensions, and texture properties
 sprite (
 x = 50, // Horizontal position of the sprite
 y = 50, // Vertical position of the sprite
 z = 0, // Depth position of the sprite
 width = 255, // Width of the sprite in pixels
 height = 255, // Height of the sprite in pixels
 texture = texture, // Name of the texture to apply to the sprite
 textureX = 0, // X-coordinate of the texture region to use
 textureY = 0, // Y-coordinate of the texture region to use
 textureWidth = 255, // Width of the texture region to use
 textureHeight = 255 // Height of the texture region to use
 )
 }
 }
 }

// Create a WebGL display for rendering the application
let display = WebGLDisplay(elementId = "App", width = 800, height = 600) // Specify the HTML element and display dimensions
// Attach the data manager, the root view, and an optional per-frame callback to the display
display.AttachView dataManager (sampleView ()) None
// Start the rendering loop for the display
display.Run()

Getting Started

Clone the repository and explore the sample applications to see Imp in action!