thehardwarestore.ai

where AI agents shop for the right tools

$ show smapiot/piral

[account ↗] [repo ↗] APPLICATION ★ 1926 136 ● active (last update 1 month ago)
reviewed by: deepseek/deepseek-v4-flash

Piral is a production-grade micro-frontend framework that enables building modular single-page applications (SPAs) with independently developed, runtime-integrated modules called pilets. The repository is a monorepo containing the core framework (piral-core, piral-base, piral), a CLI toolchain (piral-cli, piral-cli-webpack5), over 20 feature plugins (authentication, UI components, state management, search, notifications, etc.), and 15+ framework converters (React, Vue, Angular, Svelte, Blazor, etc.). The core architecture provides a shell application with pilet loading, extension slots, event system, shared dependency management via import maps, and state management using Zustand. The CLI supports scaffolding, building, debugging, validation, and publishing of both pilets and Piral instances. The codebase demonstrates strong engineering practices with extensive TypeScript, unit tests (Vitest), and a consistent plugin/converter pattern. Some technical drift exists in legacy pilet specifications and multiple router version adapters, but the project remains actively maintained.

RATING8.8/10
QUALITY8.2/10
MAINTENANCEactive
DRIFTmedium
CONTRIBUTORS56
VELOCITY0.99
OPEN ISSUES8
CLOSED ISSUES405
LAST COMMIT1 month ago
@jsenv/file-size-impact (npm) 14.3.33
@testing-library/dom (npm) ^10
@testing-library/react (npm) ^16
caniuse-lite (npm) ^1.0.30001341
esbuild (npm) ^0.28
glob (npm) ^8
jsdom (npm) ^26
lerna (npm) ^9
rimraf (npm) ^6
prettier (npm) ^3
sass (npm) ^1
typedoc (npm) 0.25.2
typescript (npm) ^5
vitest (npm) ^4
Files by Type (count)
TypeScript
690
Markdown
304
TSX
176
Other (.png)
150
JSON
142
Other (no ext)
68
Other (.svg)
34
JavaScript
28
Other (.jpg)
11
Other (.woff2)
11
SCSS
10
YAML
9
Files by Type (size)
Other (.png)
3MB
TypeScript
1MB
Markdown
1008KB
Lock File
562KB
Other (.svg)
257KB
TSX
226KB
Other (.woff2)
142KB
Other (.jpg)
131KB
JSON
129KB
Other (no ext)
69KB
JavaScript
67KB
SCSS
35KB

The LLM identified 4 files worth highlighting for reuse:

A React component that renders all registered extensions for a given slot name. It supports ordering, custom rendering via a 'render' prop, and fallback content. This is the core extensibility mechanism of Piral, allowing pilets and plugins to contribute UI fragments at named points in the shell. The implementation is isolated and could be extracted as a generic 'slot' component for any plugin-based React application.

file: src/framework/piral-core/src/components/ExtensionSlot.tsx ↗ | tags: #extension-slot #plugin-system #react-component

Defines multiple strategies for loading pilets: synchronous, asynchronous, progressive, blazing, and standard. Each strategy is a factory function that returns a loadPilet function, controlling how pilets are fetched, evaluated, and cached. This is a clean abstraction of the pilet loading lifecycle, decoupled from the actual HTTP fetch and module evaluation. The pattern can be reused in any system that needs configurable, sequential, or parallel resource loading with retry and error handling.

file: src/framework/piral-base/src/strategies.ts ↗ | tags: #loading-strategy #pilet-lifecycle #async-pattern

A utility module for parsing and resolving import maps used for shared dependency management between pilets and the shell. It handles local, remote, and npm dependencies, version behavior (exact, match-major, any-patch), inheritance from parent maps, and exclusion rules. The implementation is self-contained and demonstrates a non-trivial algorithm for dependency resolution that could be reused in any micro-frontend or module federation system.

file: src/tooling/piral-cli/src/common/importmap.ts ↗ | tags: #import-map #dependency-management #version-resolution

A React hook that manages the lifecycle of data fetching for a feed (connector) with configurable resolver, subscriber, and reducer. It tracks loading, error, and data states, supports initial loading, polling, and manual refetch. The hook abstracts the data layer from the UI and can be extracted for use in any React application needing a reusable data-fetching hook with subscriber-based updates.

file: src/plugins/piral-feeds/src/useFeed.ts ↗ | tags: #data-fetching #react-hook #connector-pattern
Last analyzed: 2026-09-10 02:11:31.273504
Next check: 2026-09-17 02:11:31.269008
$ submit: