A modern, high-performance static directory comparing the top Onchain Prop Trading firms. Built strictly with Vanilla JavaScript in adherence to the latest ES2022 standards. Designed specifically without heavy frameworks (React, Vue, etc.) to minimize overhead while retaining dynamic state reactivity, modern encapsulation, and maximum SEO visibility.
This application adopts the strict architectural paradigms outlined in our documentation (such as CLAUDE.md):
- Zero External Dependencies: Pure native API implementation. No external layout libraries or Javascript frameworks were introduced. State updates strictly map to raw JS primitives.
- Reactive Architecture: A lightweight
PubSubmechanism serves as the single-source-of-truth. Dispatches update elements viaStore.publish(event), eliminating brittle DOM-scraping state retrieval. - Native Encapsulation (Web Components): Reusable structures like the Interactive FAQs have been abstracted out into
<faq-accordion>custom elements inheritingHTMLElement, encapsulated inside a Shadow DOM and dynamically generating its accessibility requirements. - Performant DOM Loading: All large scale list rendering operations are pushed through a
DocumentFragmentbefore painting to avoid layout thrashing and reflow bottlenecks. Global listeners rely on Event Delegation mapped entirely from the top layer<body>. - A11y (Accessibility) Defaults: All buttons, links, and state toggles correctly reflect implicit
aria-*tags verified to work flawlessly via keyboard mapping. - Defensive/Typed Contexts: Strict JSDoc definition mapping
try/catchwrapping and Optional Chaining to prevent execution failure in unstructured edge-case environments.
Because the stack relies completely on pure web deliverables (index.html, style.css, script.js), getting started is effectively instantaneous.
You can view the project in a live environment utilizing Python's built-in web server:
python3 -m http.server 8000Then navigate to http://localhost:8000 to review the site layout.
All firm facts (profit splits, account sizes, chains) live in firms.json; FAQ content lives in faq.json. A zero-dependency build script regenerates every derived copy — table data in script.js, meta descriptions, JSON-LD schemas, noscript tables and FAQ accordions in index.html, and the whole of llms.txt:
node build.jsA GitHub Actions workflow runs the same script on every push and commits the result, so the generated copies can never drift from the data. To add or update a firm, edit firms.json only — never the generated regions (marked GEN:BEGIN / GEN:END).
index.html: The semantic shell, defining SEO meta configuration. It consumes standard semantic containers and<faq-accordion>custom DOM abstractions. Embedded with explicitly defined JSON-LD Schema implementations for programmatic indexing.style.css: Defines dynamic CSS Custom Property tokens (:root) encompassing the modern dark-mode implementation (glassmorphism viabackdrop-filter, radial gradients, precise grid architectures).script.js: Houses thePubSubdata store, rendering engine for dynamic nodes (DocumentFragment), theFaqAccordionWeb Component extension, and unified event delegates handling smooth-scrolling routines gracefully.
This is an open source project. We welcome contributions from the community!
You can help by:
- Adding a new prop trading firm: Submit a PR to add a new firm to the directory
- Adding an onchain tool: Contribute additional tools and resources to the ecosystem
- Improving documentation: Help clarify or expand our guides
- Bug fixes & features: Submit PRs for any improvements or fixes you discover
Simply fork the repository, make your changes, and create a pull request. All contributions are appreciated!