DEV Community: Sudhanshu Ambastha

How I Built a Stateless 3D Asset Pipeline That Manages 1,000+ Models for Free

Sudhanshu Ambastha — Tue, 14 Apr 2026 17:33:38 +0000

3D assets are a nightmare for Git. They are heavy, binary-rich, and bloat repository history faster than you can say "Pokemon."
When building the Pokémon 3D API, I hit a wall:

Manual Optimization: Resizing textures and compressing meshes for every model was exhausting.
Contributor Friction: Artists and fans wanted to contribute, but setting up Codespaces or cloning a 5GB repo just to add one model is a massive barrier.
Repository Bloat: The .git folder was growing exponentially.

I decided to nuke the old way of doing things and built a Stateless Asset Pipeline. Here’s how it works.

🏗️ The Architectural Shift: From "Storage" to "Processor"

Most repos act as a static bucket. My repository acts as a Compute Engine.

I haven't seen any other open-source projects hosting thousands of .glb files and providing them through a live API quite like this. Here is the secret sauce:

1. The "Source of Truth" is a JSON file
Instead of uploading a .glb file, a contributor just adds a metadata object to model_map.json:

{
  "id": 1000,
  "category": "regular",
  "url": "https://sketchfab.com/3d-models/your-cool-model-id"
}

2. The Zero-Friction (and Secure) Workflow
Since everything is driven by JSON, contributors don't even need to setup Codespaces or clone the repo. They can simply click "Edit" on GitHub’s web interface, paste the URL, and hit save.

Why not use GitHub Issues for submissions?

While using Issues for "file uploads" is popular, it opens a massive security hole. An unknown person could upload a malicious file or a "zip bomb" that executes during your pipeline run.

By forcing contributions through model_map.json:

Strict Validation: Only authorized team members can merge changes to the JSON.
Sanitized Input: The pipeline only processes specific Sketchfab IDs, preventing the execution of random binary "viruses" or scripts from unverified sources. 🛡️

3. The Automation Engine (GitHub Actions)

Once the JSON is updated, a GitHub Action kicks in to do the heavy lifting:

Download: Grabs the raw model via the Sketchfab API.
Optimize: Uses @gltf-transform/cli to apply Draco compression.
Texture Magic:Auto-resizes textures to 1024x1024 and converts them to WebP.
Atomic Stats: Updates a stats table in the README so the community can see the progress in real-time.

📉 The "Clean Slate" History Strategy: Wiping the Non-Optimized Weight

Binary files are the enemy of Git history. To keep the repo light, we moved from hosting both "Original" and "Optimized" versions to only production-ready assets.

To solve the history bloat, I implemented a History Pruning mechanism. Every 5 updates, the pipeline automatically:

Creates an orphan branch.
Commits the current "perfect" state of the assets.
Force-pushes to main, wiping the history of old, unoptimized binaries.

The result? The repository size remains strictly tied to the actual assets (currently around 1.5GB). We’ve eliminated the "history tax" that usually kills 3D projects on GitHub. 💎

🛠️ Storage & Workflow Buffs

While the previous version already used Draco and WebP, the V-1.1.0 architecture completely changes the game for storage consumption and accessibility:

Zero-Redundancy Storage: We purged all unoptimized "source" files. By removing the duplicates, we’ve effectively halved the disk space required for the repository.
The "History Tax" Removal: By wiping the commit history every 5 updates, a fresh clone only downloads the current assets. You no longer have to download "ghost versions" of models that were deleted or updated months ago.
Sparse-Checkout by Default: Our documentation now suggests using sparse-checkout by default. This allows developers to clone only the scripts and configuration (kilobytes) instead of the entire 1.5GB model database. It turns a massive repo into a lightweight dev environment instantly.
The JSON Shortcut: Since the pipeline is now stateless and driven by model_map.json, adding a new Pokémon is a 5-second task in a browser instead of a 5-minute task involving git pull, git add, and git push.

💡 Lessons Learned (The Hard Way)

Watch out for cross-step shell isolation in GitHub Actions. We found a bug where files modified in one step weren't "seen" by the next.

The Fix: Use git status --porcelain for change detection instead of simple diffs, and ensure your git add is aggressive.

Explore the Code & Assets: pokemon3d api assets

I Built a Cyberpunk Dev Registry (And Now It’s Open Source)

Sudhanshu Ambastha — Sun, 15 Mar 2026 12:50:59 +0000

🌍 The Vision: One Search, Any Environment

Most package browsers only show you one ecosystem, typically npm. But modern development goes far beyond that. Developers often need multiple tools and environments simultaneously — from VS Code and Docker to Winget, Homebrew, and APT.

The Universal Dev Registry was built to act as a central command center where you can stage everything you need in a single unified queue.
🚀 Access the Registry: universal-dev-registry.ambastha.org

❓ The "Why": Why Use It?

🔎 Cross-Ecosystem Search
Find your backend libraries and desktop developer tools in the same interface, eliminating the need to jump across multiple registries.

🌃 The Cyberpunk Aesthetic

Let’s be honest — we all love dark mode. The interface embraces a high-contrast Cyberpunk / Terminal UI design philosophy. If we’re going to spend hours interacting with a registry, it should feel like a mission-critical control system, not a plain white document.

🔓 Going Open Source

I’ve been working on this for a while, but I have other projects demanding my time. I realized that the best way to keep this project alive, secure, and performant is to hand the keys to the community.

The frontend (Next.js) and the backend (Node.js) are now officially public.
🛠️ Check out the code:Universal-Dev-Registry (GitHub)

⚙️ The Experience: How to Use It

Search: Use the terminal-style input for any library or application.
Stage: Add items to your Selection Queue.
Validate: The registry automatically checks for conflicts and protocol mismatches.
Execute: Generate a unified manifest for your environment.

💬 I Want Your Feedback (And Your Pull Requests!)

-⚡ Search Performance
Does the search velocity feel right for you? We’ve tuned the engine to balance speed with system stability.

🧰 Missing Developer Tools Want to add a new Winget or Homebrew app? You can contribute to the "Source of Truth" mapping repo here: ➡️ Ambastha-Org/crossplatform-desktop-apps-for-dev

I’m looking for maintainers and contributors. If you see a way to make the Auth tighter, the search faster, or the UI sleeker — open a PR. Let’s build the ultimate registry together.

🛠️ Unified Dev Registry: The All-in-One Installer for Devs

Sudhanshu Ambastha — Fri, 13 Mar 2026 13:35:24 +0000

🌍 The Vision: One Search, Any Environment

Most package browsers only show you one ecosystem, typically npm. But modern development goes far beyond that.

Developers often need multiple tools and environments simultaneously, such as:

VS Code
Docker
Python
System runtimes
Language-specific libraries

The Universal Dev Registry was built to act as a central command center where developers can stage everything they need — from npm and pip packages to Winget, Homebrew, and APT applications — in a single unified queue.

🚀 Check out the live registry here: universal-dev-registry

❓ The "Why": Why Use It?

🔎 Cross-Ecosystem Search

Find your backend libraries and desktop developer tools in the same interface, eliminating the need to jump across multiple registries.

🌃 The Cyberpunk Aesthetic

Let’s be honest — we all love dark mode.

The interface embraces a high-contrast Cyberpunk / Terminal UI design philosophy.

If developers are going to spend hours interacting with a registry, it should feel like a mission-critical control system, not a plain white document.

⚙️ The Experience: How to Use It

🔎 Search
Use the terminal-style input to search for any module, library, or developer application.
📦 Stage
Add selected items to your Selection Queue to build your installation stack.
🧪 Validate
The registry automatically checks for potential conflicts, such as incompatible protocols or issues like npm vs yarn lockfile mismatches.
🚀 Execute
Once validated, prepare your manifest for installation to generate a unified list of commands for your environment.

🛠️ View the Protocol on GitHub: Universal-Dev-Registry

💬 I Want Your Feedback!

⚡ Search Performance

Does the search velocity feel right for you? We’ve tuned the engine to balance speed with system stability, but real-world developer feedback helps us refine the experience.

🧰 Missing Developer Tools

Are there specific apps for Winget / Homebrew / APT that you want to see indexed?

You can actually contribute to the source of truth yourself.

If there’s a developer tool missing, add it to our cross-platform mapping repository:

➡️ Ambastha-Org/crossplatform-desktop-apps-for-dev

🔐 Protocol Lock Sensitivity

Is the "Protocol Lock" too sensitive, or do you appreciate the added protection?

We designed this mechanism to stop automated bots and scraping activity, but we also want to ensure it doesn’t interfere with real developer workflows.

🔗 Quick Links

Live Registry: universal-dev-registry.ambastha.org
Main Repo: Universal-Dev-Registry

🚀 Electron Desktop Apps with Next.js & Tailwind CSS v4: The Missing "No-Bloat" Boilerplate

Sudhanshu Ambastha — Tue, 24 Feb 2026 03:38:51 +0000

Hey everyone! 👋

I've been working with Nextron (Next.js + Electron) lately, and I noticed a frustrating gap. Most templates out there are either:

TypeScript-only (heavy and sometimes unnecessary for quick tools).
Outdated (still using Tailwind v3 or old PostCSS configs).
Incomplete (requiring manual "plumbing" to get JS and Tailwind working together).

I found that the official saltyshiomix/nextron examples were either TS-focused or lacked a pre-configured Tailwind v4 setup. So, I took the base JS skeleton and manually integrated the new Tailwind CSS v4 engine.

Introducing: nextron-js-tw4-boilerplate 🛠️✨

🔥 Why This Template?

I manually configured this to be "plug-and-play" so you can skip the setup headache:

Tailwind CSS v4 Engine: Pre-installed with the high-performance @tailwindcss/postcss bridge.
Pure JavaScript: Zero TypeScript bloat. Ideal for rapid prototyping.
Next.js 14 (Pages Router): Chosen for its rock-solid stability in the Electron renderer process.
Fixed Production Assets: I pre-configured unoptimized: true in renderer/next.config.js so your images and assets don't break when you build your .exe or .dmg. 📦✅

🛠️ How to Use It

You can start your new project in two ways:

1️⃣ The "One-Click" Way (Recommended)

Go to the GitHub Repo and click the green "Use this template" button. This creates a fresh repo under your account immediately! 🖱️🔥

2️⃣ The CLI Way

# Clone the repo
git clone https://github.com/Sudhanshu-Ambastha/nextron-js-tw4-boilerplate.git

# Enter the directory
cd nextron-js-tw4-boilerplate/template

# Install & Run
npm install
npm run dev

🧠 Technical Highlights

Since Nextron has a unique directory structure, I’ve handled a few critical configurations for you:

Scanning via @source: In renderer/styles/global.css, I added the @source directive so Tailwind v4 correctly scans your JSX files inside the renderer folder.
PostCSS Bridge: Fully configured postcss.config.js to ensure the v4 engine talks to the Next.js build pipeline correctly.

📝 Open Source

This is released under the MIT License. I’m a big fan of the Electron community and wanted to provide a modern, JS-first alternative that works out of the box.

GitHub Repository: Sudhanshu-Ambastha/nextron-js-tw4-boilerplate

What are you building with Electron? Let me know in the comments if you run into any issues or have suggestions! 👇

The journey of scaling a personal project into a community resource for 3D Pokémon assets.

Sudhanshu Ambastha — Wed, 07 Jan 2026 00:16:37 +0000

From Side Project to Official Organization 🚀

What started as a personal experiment to view a few Pokémon in 3D has officially evolved. Today, I’m excited to announce the launch of the Pokémon 3D API Organization—a dedicated home for optimized 3D assets and a high-performance API.

🧱 The Problem: 3D Assets are Heavy

Most Pokémon APIs provide great metadata, but finding consistent, web-ready 3D models is a challenge. Raw .glb files are often massive, leading to slow load times and high bandwidth costs.

🛠️ The Solution: Automation & Optimization

To solve this, I built a pipeline that:

Automates Optimization: Using GitHub Actions and glTF-Transform, every model is Draco-compressed.
Scalable Architecture: I split the project into three specialized layers:
- The Assets: 1,300+ models with animations.
- The API Server: A RESTful engine for metadata.
- The Showcase: A responsive frontend demo using Google's <model-viewer>.

❤️ A Heartfelt Thank You

The original repository on my personal profile received so much love and support from the community. It’s that energy that pushed me to build something more permanent and professional.

I have a small favor to ask: If you found value in my original project, please consider giving that same love to our new official repositories. Starring the new repos helps other developers find these resources!

🔗 Explore the Ecosystem

📍 Official Organization: github.com/Pokemon-3D-api
🚀 New API Server: Get the Metadata
🎨 Interactive Showcase: See it in Action

⚖️ Legal Note

This is a non-commercial fan project. Pokémon and Pokémon character names are trademarks of Nintendo. This project is strictly for educational use.

What's next? I'm working on adding more animations and models from latest gen and leftovers for the API. I'd love to hear your thoughts in the comments!

🚀 Terminal Efficiency Unleashed: Meet the Textual TUI for Winget for Windows

Sudhanshu Ambastha — Sat, 29 Nov 2025 04:38:42 +0000

🎉 Terminal Package Store: The TUI App for Winget on Windows

Hey everyone! 👋 I'm excited to introduce my latest project, Terminal Package Store — a high-performance, interactive Textual User Interface (TUI) designed to transform how you manage packages on Windows with Winget.

If you're tired of running long, repetitive CLI commands just to check for updates or uninstall an application, this is for you! This app combines the power of Winget with the efficiency and clarity of a dedicated visual interface, all without ever leaving your terminal window.

✨ Features That Make Management Effortless 😍

The Terminal Package Store is built to turn package management from a chore into a seamless experience:

🖥️ Split-Screen Command Center

A clean, two-pane layout:

Main view: list of packages
Side panel: detailed information and actions

📦 Visual List of Upgrades

Immediately see which installed apps have updates available — no messy CLI output.

⚡ One-Click Actions (No More Boilerplate!)

Execute complex Winget operations with a single UI action:

Update Selected Package
Uninstall Package

🔄 Non-Blocking Background Operations

Updates and uninstalls run in a separate terminal window, keeping the TUI responsive and smooth.

🔔 Integrated Self-Update Check

The app can check GitHub for the latest version of itself.

🛠️ Built With Modern Python

This project showcases next-gen TUI development tools:

Textual Framework — high-performance widgets, CSS styling, reactive state
Textual Workers — background threading for heavy operations
Winget — underlying package manager performing installations, updates, uninstalls

💡 Why This Approach Matters

This app bridges the gap between:

the raw power of the command line
and the usability of a GUI

It reduces cognitive load, saves time, and makes package maintenance a fast, visual, intuitive task.

🚀 Ready to Try It?

The Terminal Package Store is ready to use!

If you find this tool useful, please:

⭐ Star the repo
📨 Share it with Windows developers and power users

🔗 Links

GitHub Repository: Terminal-Package-Store
Issues / Feedback: Issues

Happy packaging! 😊

Pokedex - 3D Pokémon Viewer: Gotta View 'Em All in 3D! ✨

Sudhanshu Ambastha — Thu, 01 May 2025 14:55:03 +0000

Hey everyone! 👋 I'm excited to share my latest project: the Pokedex - a web application that lets you explore the fascinating world of Pokémon in a whole new dimension!

Ever wanted to get a closer look at your favorite Pokémon? Rotate them, zoom in, and even watch their animations? Well, now you can! This Pokedex brings Pokémon to life with interactive 3D models, right in your browser.

Features You'll Love 😍

Browse a Stunning Grid: Dive into a visually appealing grid showcasing Pokémon with their vibrant 3D models. It's like having your own digital Pokémon collection!
Filter by Generation: Feeling nostalgic for a specific era? Easily filter Pokémon by their generation and relive your favorite moments.
Explore Different Forms: Discover the incredible variety within the Pokémon universe! Browse through different forms like Alolan, Galarian, Mega Evolutions, and more.
Lightning-Fast Search: Looking for a specific Pokémon? Quickly find them by name or their Pokédex number with the intuitive search bar.
Detailed 3D Views: Click on any Pokémon to enter a detailed view. Here, you can interact with the 3D model, check out their base stats (HP, Attack, Defense, Sp. Atk, Sp. Def, Speed), and explore available forms and animations.
Unravel Evolution Chains: Curious about how your favorite Pokémon evolves? Trace their evolutionary path with the integrated evolution chain viewer.
Interactive 3D Models: Use your mouse or touch to rotate, pan, and zoom in on the 3D models. Get up close and personal with every detail!
Animated Fun: Watch various animations of the Pokémon models, bringing them to life right before your eyes.

How to Use It 🕹️

Welcome Aboard! The app starts with a friendly welcome screen.
The Pokémon Grid: After the welcome, you'll land on the main Pokémon grid, filled with 3D models.
Filtering Made Easy:
- Use the "All Forms" dropdown to explore different variations of Pokémon.
- The "All Generations" dropdown lets you focus on specific Pokémon eras.
- Type in a name or ID in the search bar and hit the search button (🔍) to find your target Pokémon instantly.
Dive into Details: Click on a Pokémon in the grid to see its in-depth information.
Interactive Details: On the Pokémon's page:
- Manipulate the 3D model to your heart's content.
- Select different forms from the "Select Form" dropdown.
- Choose from available animations using the "Select Animation" dropdown.
- Get all the crucial base stats at a glance.
- Navigate through the Pokedex using the handy arrow buttons.
- Click "Evolution List" to see its evolutionary journey.
Tracing Evolutions: The evolution chain page clearly lays out the Pokémon's evolution line. Click on any Pokémon in the chain to view its details.

Built With 💪

React
Vite
Tailwind CSS
@google/model-viewer (The magic behind the interactive 3D models!)
Axios (For fetching data from APIs)
React Router DOM (For smooth navigation)

Powering the Pokedex ⚡

This app wouldn't be possible without these amazing APIs:

Pokémon Data and Stats: PokeAPI Proxy
3D Pokémon Models and Animations: Pokémon3D API
Pokémon Species and Evolution Data: PokeAPI

Ready to Explore? 🚀

You can experience the Pokedex live here: Pokedex

And if you're curious about the code or want to contribute, check out the repository on GitHub

Final Thanks 🙏

A huge thank you to the incredible developers behind the PokeAPI and the Pokémon3D API for providing the essential data and resources that make this project possible.
And of course, a massive shoutout to the passionate Pokémon community for their endless support and enthusiasm!

If you find this Pokedex useful or just plain awesome, please consider giving the repository a star 🌟 and sharing it with your fellow Pokémon enthusiasts! Happy exploring! 😊

Powering Up PolyDisease Predictor: Backend Integration and Expanding Horizons! 🚀

Sudhanshu Ambastha — Thu, 01 May 2025 14:30:48 +0000

Hey everyone!

I'm excited to share some significant progress on the PolyDisease Predictor, a @streamlit web application I've been building to predict various diseases based on user input. In this update, we've laid some crucial groundwork for future enhancements and are actively expanding the application's capabilities.

Laying the Foundation: MySQL Backend Integration

One of the key developments has been the successful integration of a MySQL backend into the PolyDisease Predictor. This marks a significant step forward, allowing the application to now persistently store user interactions and feedback across all prediction modules (Diabetes, Heart Disease, and Multiple Disease Prediction).

Why a Backend?

Implementing a database opens up a world of possibilities for improving the application, including:

Gathering Insights: We can now collect valuable data on how users interact with the predictor, which symptoms are frequently entered, and the accuracy of the predictions based on user feedback.
Model Refinement: This data can be crucial for analyzing the performance of our prediction models and identifying areas for improvement and retraining.
Future Features: Having a backend infrastructure in place will enable us to explore exciting new features in the future, such as personalized risk assessments and tracking disease prevalence trends.

Your Feedback Matters: Implementing a Feedback Mechanism

To make the most of this new backend, we've also implemented a simple yet powerful feedback mechanism. After receiving a prediction for diabetes, heart disease, or multiple diseases, users can now indicate whether the prediction was "👍 Correct" or "👎 Incorrect." This direct feedback is now being stored in our MySQL database, providing us with valuable signals on the application's accuracy.

Expanding Our Knowledge: Adding More Symptoms and Diseases (Work in Progress!)

The PolyDisease Predictor's core strength lies in its ability to predict multiple diseases based on user-provided symptoms. We're actively working on expanding the range of symptoms and the number of diseases the application can predict.

While this is an ongoing process, the integration of the MySQL backend provides the necessary structure to manage and utilize this growing dataset effectively. We're continuously training and refining our models with this expanded information.

Tech Deep Dive: Streamlit Secrets for Database Configuration

For those interested in contributing or running the application locally, the MySQL database connection details are managed securely using Streamlit's secrets.toml file. This allows for easy configuration without hardcoding sensitive information directly into the application.

Example secrets.toml Structure:

[mysql]
host = "your_mysql_host"
user = "your_mysql_user"
password = "your_mysql_password"

Remember to replace the placeholder values with your actual MySQL credentials and ensure this file is not committed to any public repositories (add it to your .gitignore!).

What's Next?

We're continuing to focus on:

Expanding the database of symptoms and diseases.
Analyzing the collected feedback to improve the accuracy of our prediction models.
Exploring new features that leverage the backend infrastructure.

Stay tuned for more updates as we continue to evolve the PolyDisease Predictor! Your feedback and contributions are always welcome.

GitHub Repository:GitHub Repository

Deployed Working Model:Deployed Model

Python with mysql

Sudhanshu Ambastha — Mon, 21 Apr 2025 06:20:38 +0000

Pokémon-3D API v1.0.1 - Repository Restoration

Sudhanshu Ambastha — Sun, 23 Mar 2025 07:01:39 +0000

Hello Pokémon 3D Enthusiasts!

We're excited to announce the release of v1.0.1 of the Pokémon-3D API! This release addresses a critical operational issue and brings some exciting updates.

Important Changes & What Happened:

Due to unforeseen technical challenges, we had to completely delete and recreate the Pokémon-3D API repository. This was necessary to ensure the long-term stability and functionality of the API. We sincerely apologize for any downtime or confusion this may have caused.

What's New in v1.0.1:

While this release primarily focuses on restoring the API, we've also included a few exciting additions:

Repository Recreated: The repository has been rebuilt from scratch.
Backend Restarted: The backend services are now running smoothly and reliably.
API Functionality Restored: The API is now fully operational, mirroring the functionality of v1.0.0.
New Endpoint: The API endpoint has changed! Please update your integrations to use the new endpoint. The old endpoint will no longer function.
Added few New Pokémon: We've expanded our collection with few new Pokémon models! You can now access these through the updated endpoint.

Support & Love:

We were incredibly grateful for the support and love you showed the previous repository, which garnered 13 stars. We hope you'll continue to support this new iteration of the Pokémon-3D API with the same enthusiasm!

Key Points:

Please update your API integrations to use the new endpoint.
The old endpoint is no longer active.
We have added few new pokemon models.
This release ensures the API's stability and future development.

Where to Find More Information:

For details on the API's features and structure, please refer to the v1.0.0 Changelog.

What's Next?

We're committed to continuously improving the Pokémon-3D API. Expect new features, models, and enhancements in future releases. We appreciate your patience and understanding.

Thank you for your continued support!

New Links:

🚀 Major Release! Pokémon 3D API v1.0.0: Breaking Changes, Models, and More!

Sudhanshu Ambastha — Sat, 22 Mar 2025 07:42:05 +0000

Hey Dev.to community!

I'm excited to announce the release of v1.0.0 of the Pokémon 3D API! This is a significant milestone, packed with breaking changes, a ton of new 3D models, and a complete overhaul of the documentation.

What's New in v1.0.0?

This isn't just a minor update – we've made some fundamental changes to how the API works, so if you're already using it, please pay close attention!

💥 Breaking API Changes:

The JSON response structure has been completely revamped. We've introduced a nested structure to better organize Pokémon forms.

Why the change? This new structure allows for more flexibility and easier access to different Pokémon forms (regular, shiny, etc.).

Migration is necessary! If your applications rely on the previous API structure, you'll need to update your parsing logic. Here's a quick example of the new format:

[
  {
    "id": 1,
    "forms": [
      {
        "name": "Bulbasaur",
        "model": "https://raw.githubusercontent.com/Sudhanshu-Ambastha/Pokemon-3D/main/models/opt/regular/1.glb",
        "formName": "regular"
      },
      {
        "name": "Shiny Bulbasaur",
        "model": "https://raw.githubusercontent.com/Sudhanshu-Ambastha/Pokemon-3D/main/models/opt/shiny/1.glb",
        "formName": "shiny"
      }
      // ... more forms
    ]
  },
  // ... more Pokémon objects
]

📚 Comprehensive Documentation Overhaul:

We've completely rewritten the documentation to reflect the new API structure and provide more detailed explanations.

Key updates include:

Clearer explanations of the API endpoint and JSON response structure.
Updated Pokémon category and count information.
Practical Example: For a working example of how to use the new API, check out the opt.html file in the repository. This page is using the new API to display the optimized 3D models.

✨ Significant Model Additions:

We've added few new 3D models to the collection! Now you have even more Pokémon to display in your projects.

Why This Release Matters

This release marks a significant step forward in making Pokémon 3D models readily accessible for developers. Whether you're building a fan project, a game, or just experimenting with 3D graphics, this API provides a convenient way to integrate Pokémon models.

How to Get Started

Check out the updated documentation: documentation
Review the opt.html example: OPT.html
Update your code: If you're using a previous version, make sure to update your code to handle the new JSON structure.

We Need Your Feedback!

This is a community-driven project, and your feedback is invaluable. If you encounter any issues, have suggestions for improvements, or just want to share your projects, please let us know in the comments below! We're eager to see what you build.

3D Pokémon Models via API: JSX or GLB - What's Your Take?

Sudhanshu Ambastha — Tue, 18 Mar 2025 15:15:00 +0000

Hey Devs,

I've been tinkering with the Pokémon 3D API, and it's raised an interesting question: how do we provide 3D models in the most developer-friendly way? Specifically, JSX components vs. GLB files.

My Perspective (as a "Client"):
For me, as someone building an application using the API, JSX components are incredibly appealing. Imagine rendering a Pokémon with just a few lines of code like they are simpler to render, whereas in glb we have to preprocess each file or do a manual setup while rendering to make them visible on UI

The Reality Check:
We know direct browser execution of fetched JSX has security risks and they also need to be compiled at runtime because which it doesn't work else download them but when there are more then 1k+ which could possibly reach to 2mb+ but when crossed 2k+ it will lead to 4mb as it will still load the glb models i.e makes load as 2-4 MB on fetch on site as the jsx one is just to simplify things and handling that many jsx comp is not good to be present in local. GLB files are safer, but the setup and preprocessing for each file..😩

Alternatives I've Explored:

Server-Side Rendering (SSR): Processing JSX and GLBs on the server and provide it to user but need to setup webpack I don't even know does this will work or not.
Custom DSL (Domain-Specific Language): Using JSON to describe 3D scenes, enabling safer and more controlled client-side rendering, yeah we can provide position, scale for models with api.
WebAssembly (WASM): Compiling 3D processing code to WASM for better performance and potential security enhancements but I don't even know what is 'W' of WASM like never worked with it.
NPM Module Delivery: Packaging JSX components and their dependencies as NPM modules for easy installation and import but is the ease of installation worth the increased bundle size?.

The Question For You:

Which approach do you find simpler, and why?
How do we balance security with developer experience?
For beginners, does the simplicity of JSX outweigh the potential complexities of using GLB files?
If the current GLB-only approach is sufficient, and we can effectively preprocess it, is there truly a need for JSX components?
What solutions can we explore to make 3d model rendering easier for everyone?
CDN Delivery: Providing GLB files via CDN links, like: https://cdn.jsdelivr.net/gh/Sudhanshu-Ambastha/Pokemon-3D/models/glb/alolan/103.glb or https://raw.githubusercontent.com/Sudhanshu-Ambastha/Pokemon-3D/main/models/glb/alolan/103.glb but still it is same or what we use to point to file in api (i.e I meant from githubusercontent one) but as i heard cdn one can improve performance as it provides caching & can only provide max to 15 MB etc so is it a good idea to switch from githubusercontent to cdn?

I'm genuinely curious to hear your thoughts! Let's discuss in the comments.