Security News
The Hidden Blast Radius of the Axios Compromise
The Axios compromise shows how time-dependent dependency resolution makes exposure harder to detect and contain.
By Ahmad Nassri - Apr 01, 2026
New Research: Supply Chain Attack on Axios Pulls Malicious Dependency from npm.Details → →
@minimact/core
Advanced tools
@minimact/core
Client-side runtime for Minimact framework - Available in lightweight (SignalM) and full (SignalR) versions
Minimact Client Runtime
Client-side JavaScript/TypeScript runtime for the Minimact framework. Handles DOM patching, SignalR communication, client state management, and hybrid rendering.
Architecture
┌─────────────────────────────────────────────────────────────┐
│ Minimact Client Runtime │
│ │
│ ┌──────────────┐ ┌──────────────┐ ┌──────────────┐ │
│ │ SignalR │ │ DOMPatcher │ │ ClientState │ │
│ │ Manager │ │ │ │ Manager │ │
│ └──────┬───────┘ └──────┬───────┘ └──────┬───────┘ │
│ │ │ │ │
│ └─────────┬───────┴──────────────────┘ │
│ │ │
│ ┌─────────▼─────────┐ │
│ │ Minimact Core │ │
│ │ (Orchestrator) │ │
│ └─────────┬─────────┘ │
│ │ │
│ ┌─────────▼─────────┐ ┌──────────────┐ │
│ │ Hydration │ │ Event │ │
│ │ Manager │ │ Delegation │ │
│ └───────────────────┘ └──────────────┘ │
└─────────────────────────────────────────────────────────────┘
Features
✅ SignalR Integration - Real-time bidirectional communication with server ✅ DOM Patching - Surgical DOM updates from server-generated patches ✅ Client State - Local reactive state (useClientState) without server round-trips ✅ Hybrid Rendering - Smart partitioning of client/server/mixed zones ✅ Event Delegation - Efficient event handling with single root listener ✅ Hydration - Attach interactivity to server-rendered HTML ✅ TypeScript - Full type safety and IDE support
Installation
npm install
npm run build
This generates:
dist/minimact.js- IIFE bundle for browsersdist/minimact.esm.js- ES module bundledist/minimact.d.ts- TypeScript definitions
Usage
Basic Setup
<!DOCTYPE html>
<html>
<body data-minimact-auto-init>
<!-- Component rendered by server -->
<div data-minimact-component="counter-1">
<h1>Count: <span data-bind="count">0</span></h1>
<button data-onclick="Increment">+</button>
</div>
<!-- Include SignalR -->
<script src="https://cdn.jsdelivr.net/npm/@microsoft/signalr@8.0.0/dist/browser/signalr.min.js"></script>
<!-- Include Minimact -->
<script src="minimact.js"></script>
</body>
</html>
The data-minimact-auto-init attribute automatically starts Minimact on page load.
Manual Initialization
import Minimact from 'minimact-client';
const minimact = new Minimact(document.body, {
hubUrl: '/minimact',
enableDebugLogging: true,
reconnectInterval: 5000
});
await minimact.start();
Client State (useClientState)
<!-- Client-only zone - no server round-trips -->
<div data-minimact-client-scope>
<input data-state="username" placeholder="Username" />
<p>Hello, <span data-bind="username"></span>!</p>
</div>
The input updates instantly on every keystroke, with ~1ms latency.
Server State
<!-- Server-controlled zone -->
<div data-minimact-server-scope>
<button data-onclick="LoadData">Load</button>
<p>Items: <span data-bind="itemCount">0</span></p>
</div>
Button clicks trigger server methods, updates arrive via SignalR patches (~47ms latency).
Hybrid Rendering
<!-- Mixed dependencies - smart span splitting -->
<p>
Found
<span data-minimact-server-scope data-bind="resultCount">0</span>
results for
"<span data-minimact-client-scope data-bind="query"></span>"
</p>
Each span updates independently - client span instantly, server span on data changes.
API Reference
Minimact Class
class Minimact {
constructor(rootElement: HTMLElement | string, options?: MinimactOptions);
// Lifecycle
start(): Promise<void>;
stop(): Promise<void>;
// Component management
hydrateComponent(componentId: string, element: HTMLElement): void;
// Client state
getClientState(componentId: string, key: string): any;
setClientState(componentId: string, key: string, value: any): void;
subscribeToState(componentId: string, key: string, callback: (value: any) => void): () => void;
// Connection info
get connectionState(): string;
get connectionId(): string | null;
}
Options
interface MinimactOptions {
hubUrl?: string; // Default: '/minimact'
enableDebugLogging?: boolean; // Default: false
reconnectInterval?: number; // Default: 5000ms
}
Data Attributes
Component Markers
data-minimact-component="id"- Marks a component rootdata-minimact-component-id="id"- Set during hydration
Zone Markers
data-minimact-client-scope- Pure client zone (no server communication)data-minimact-server-scope- Pure server zone (patch-controlled)- Neither attribute = hybrid zone (contains both)
State Binding
data-state="key"- Bind input element to client state keydata-bind="key"- Bind element content to state keydata-bind-html- Bind using innerHTML instead of textContent
Event Handlers
data-onclick="MethodName"- Click event → server methoddata-oninput="MethodName"- Input event → server methoddata-onchange="MethodName"- Change event → server method- Format:
MethodNameorMethodName:arg1:arg2
Examples
See examples/ folder:
- counter.html - Basic counter with server state
- hybrid-rendering.html - Demonstrates client/server/hybrid zones
Performance
| Operation | Latency | Description |
|---|---|---|
| Client state update | ~1ms | Local DOM manipulation only |
| Server state update | ~47ms | SignalR round-trip + Rust reconciliation |
| Hybrid update | ~1ms + ~47ms | Each zone updates independently |
Development
# Install dependencies
npm install
# Build for production
npm run build
# Watch mode
npm run dev
# Run tests (when implemented)
npm test
Project Structure
client-runtime/
├── src/
│ ├── index.ts # Main entry point
│ ├── signalr-manager.ts # SignalR connection management
│ ├── dom-patcher.ts # DOM patching engine
│ ├── client-state.ts # Client state management
│ ├── event-delegation.ts # Event handling
│ ├── hydration.ts # Server HTML hydration
│ └── types.ts # TypeScript definitions
├── examples/
│ ├── counter.html # Basic example
│ └── hybrid-rendering.html # Advanced example
├── dist/ # Build output
├── package.json
├── tsconfig.json
└── rollup.config.js
Browser Support
- Modern browsers with ES2020 support
- SignalR WebSocket or SSE support
- Tested on Chrome 90+, Firefox 88+, Safari 14+, Edge 90+
Integration with Server
The client runtime expects:
- SignalR Hub at
/minimact(configurable) - Component registration via
RegisterComponent(componentId) - Patch format matching Rust reconciliation engine output
- Method invocation via
InvokeComponentMethod(componentId, methodName, argsJson)
See Minimact.AspNetCore C# project for server implementation.
Debugging
Enable debug logging:
<body data-minimact-auto-init data-minimact-debug>
Or programmatically:
const minimact = new Minimact(document.body, {
enableDebugLogging: true
});
Console output includes:
- SignalR connection events
- DOM patch operations
- Client state changes
- Event delegation triggers
- Hydration progress
License
MIT
FAQs
Client-side runtime for Minimact framework - Available in lightweight (SignalM) and full (SignalR) versions
We found that @minimact/core demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Package last updated on 10 Nov 2025
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Related posts
Research
Supply Chain Attack on Axios Pulls Malicious Dependency from npm
A supply chain attack on Axios introduced a malicious dependency, plain-crypto-js@4.2.1, published minutes earlier and absent from the project’s GitHub releases.
By Socket Research Team - Mar 31, 2026
Research
TeamPCP Compromises Telnyx Python SDK to Deliver Credential-Stealing Malware
Malicious versions of the Telnyx Python SDK on PyPI delivered credential-stealing malware via a multi-stage supply chain attack.
By Socket Research Team - Mar 27, 2026