SDX DRAST (Theme Engine) | Drupal.org
Skip to search
Can we use first and third party cookies and web beacons to
understand our audience, and to tailor promotions you see
SDX DRAST (Theme Engine)
Primary tabs
View
(active tab)
Version control
This project is not covered by Drupal’s
security advisory policy
SDX DRAST (
rupal
ender
rrays to
tructured
okens) replaces Drupal's Twig template engine with a structured data pipeline. Instead of producing HTML strings, the engine outputs typed JSON that React, Vue, or Svelte components consume directly. Write
block.tsx
instead of
block.html.twig
, and your framework component receives structured props instead of pre-rendered markup.
Why SDX DRAST
Twig produces HTML strings. JavaScript frameworks consume data. SDX DRAST bridges that gap at the Drupal render pipeline level, so your components never parse DOM or decode HTML markers.
Every rendering path (page load, SPA navigation, AJAX dialog) produces the same structured output. One pipeline, one data format.
Features
Structured Token Rendering
Self-contained tokens (
__SDX{base64json}SDX__
) embed component ID and props directly in the string
Tokens survive Drupal's render cache without side-channel state
Server resolves tokens into
ComponentNode[]
arrays before sending to the client
Client receives clean JSON. No DOM parsing, no base64 decoding, no HTML markers
Template Engine
Implements Drupal's template engine contract as a drop-in Twig replacement
Resolves
.tsx
.vue
.svelte
templates for any Drupal theme hook
Template auto-discovery:
templates/block/block.tsx
templates/form-element/form-element.tsx
Scans themes, base themes, and enabled modules for template overrides
Set
engine: drast
in your theme's
.info.yml
to activate
Region-Level Partial Reloads
Per-region cache tag checksums computed during rendering
On SPA navigation, only regions whose cache tags changed are re-rendered and sent
Unchanged regions preserved client-side from previous navigation
AJAX Structured Responses
Tokens in AJAX dialog responses are resolved to structured data automatically
Forms opened in modals receive the same structured output as full page loads
DataProvider Plugin System (sdx_data_provider submodule)
Route-level typed data via PHP 8 attributes (
#[SdxDataProvider]
Prop priorities:
Prop::IMMEDIATE
Prop::DEFERRED
Prop::LAZY
for progressive loading
Persistent layouts via
getLayout()
keep UI state across navigations
Partial prop updates, CSRF token injection, contextual links resolution
DataProviders included: admin overview, appearance, block layout, config pages, content types, entity lists, field UI, help, menu editor, permissions, status report, Views editor, and more
Serialization
Form serialization with per-element-type handlers (select, textarea, boolean, file, table, text format, etc.)
Entity field extraction, render array serialization, native HTML rendering for standard Drupal elements
Breadcrumb, tabs, actions, and messages extraction via PageDataExtractor
How It Works
Render array > Drupal renderer (structured mode) > self-contained tokens > PageRenderer resolves tokens > ComponentNode[] JSON > Client renders directly
The engine hooks into Drupal's standard rendering pipeline. When a theme hook is rendered,
DrastThemeEngine
creates a structured token instead of calling Twig.
PageRenderer
collects all tokens after the page is built, resolves them into a typed component tree, serializes regions with cache tag checksums, and sends the result as JSON.
The client framework receives a complete page description: regions as component arrays, metadata (title, breadcrumb, tabs, messages), and the main content as either a DataProvider response or resolved region data.
Post-Installation
Install the
SDX
module first
Enable
sdx_drast
and optionally
sdx_data_provider
Set
engine: sdx
in your theme's
.info.yml
Create framework templates in your theme's
templates/
directory
Run
drush cr
to rebuild the theme registry
A base theme with common Drupal templates already implemented is available at
SDX React Base
Additional Requirements
Drupal 10.3+ or 11
PHP 8.3+
SDX
module
A theme with
engine: sdx
and framework component templates
Recommended modules/libraries
SDX
(required) provides framework plugins, build pipeline, and component discovery
sdx_router
(included in SDX) for SPA navigation with partial reloads
sdx_ssr
(included in SDX) for server-side rendering of full pages
SDX React Base
base theme with standard Drupal templates
Similar projects
Inertia.js
for Laravel replaces Blade with React/Vue page components. SDX DRAST takes the same approach for Drupal but goes deeper: template-level replacement (not just page-level), region-level partial reloads via cache tags, and integration with Drupal's block and render systems.
Decoupled Drupal
(Next.js, Nuxt, Gatsby) requires a separate frontend application and a JSON API layer. SDX DRAST keeps everything in Drupal: one deployment, one codebase, full access to admin UI, permissions, and editorial workflows.
Supporting this Module
Report bugs and feature requests in the
issue queue
Part of the
SDX ecosystem
. The engine is a separate module because it is optional: SDX components work in Twig templates without it.
Community Documentation
- Coming Soon -
Project information
Project categories:
Integrations
Ecosystem:
SDX
Created by
vzsigmond
on
23 April 2026
, updated
23 April 2026
This project is not covered by the
security advisory policy
Use at your own risk!
It may have publicly disclosed vulnerabilities.
Releases
1.0.0-alpha1
released 23 April 2026
Works with Drupal: ^10.3 || ^11
Migration from SDX Engine to SDX Drast
Using Composer to manage Drupal site dependencies
View all releases
Maintainers
vzsigmond
Issues for SDX DRAST (Theme Engine)
To avoid duplicates, please search before submitting a new issue.
All issues
0 open
0 total
Bug report
0 open
0 total
Resources
Read license
View project translations
Development
Source code
Issues
Commit log
GitLab activity
Report a security vulnerability
View change records
Infrastructure management for Drupal.org provided by
Need a Drupal 7 extended support partner? Consider Tag1.
News items
News
Planet Drupal
Social media
Sign up for Drupal news
Security advisories
Jobs
Our community
Community
Services
Training
Hosting
Contributor guide
Groups & meetups
DrupalCon
Code of conduct
Documentation
Documentation
Drupal Guide
Drupal User Guide
Developer docs
API.Drupal.org
Drupal code base
Download & Extend
Drupal core
Modules
Themes
Distributions
Governance of community
About
Web accessibility
Drupal Association
About Drupal.org
Drupal is a
registered trademark
of
Dries Buytaert