NLnet Grant Milestone 1.b – SolidOS Modernize Code

November 2025 marks a bit over a month since our previous release. Milestone 1.b focuses on the modernization and optimization of the SolidOS codebase — once again a milestone centered heavily on backend improvements. Below is an overview of the work completed during this phase.

About SolidOS

SolidOS is a monolithic, plugin-based, semantic web application framework.

It is monolithic in the sense that Mashlib is bundled into a single build (historically via webpack). All panes and dependencies are packaged into one large JavaScript file. Despite this, the internal architecture is modular:

• Each pane is a self-contained module that exports metadata and a render function.
• Libraries such as solid-ui and rdflib provide shared utilities and UI components.
• Mashlib orchestrates the system but does not define application logic.

It is plugin-based thanks to its dynamic pane system: each pane registers itself through solid-panes.register().

Finally, the UI is semantic data–driven rather than URL- or route-driven (as in React, Angular, or Vue). The RDF type of the resource dictates which UI to display, and the RDF graph acts as the central shared data model.

Conclusion: Comparison to Modern Architectures

Milestone 1.b Work

All work was tracked in a single GitHub issue: #224. Work included architectural changes, code structure updates, configuration improvements, aligned build processes, release bundling, and code fixes.

Architectural Changes

The biggest architectural update was the decision not to bundle rdflib, solid-logic, and solid-ui inside Mashlib. Developers now explicitly import dependencies:

<script src="https://cdn.jsdelivr.net/npm/rdflib/dist/rdflib.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/solid-logic/dist/solid-logic.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/solid-ui/dist/solid-ui.min.js"></script>
<script>
const rdf = window.$rdf;
const logic = window.SolidLogic;
const UI = window.UI;
logic.authn.checkUser().then((webId) => {
  const solidLogo = 'https://solidproject.org/assets/img/solid-emblem.svg'
  const myButton = UI.widgets.button(document, solidLogo, 'test', () => alert('clicked!'))
  UI.widgets.clearElement(document.body)
  document.body.appendChild(myButton)
})
</script>

This reduces coupling, improves bundling, enables future experimentation, and improves tree-shaking. Mashlib bundle size decreased from 5.67 MiB to 4.33 MiB.

Code Structure Updates

• Repositories now build to dist instead of lib.
• solid-logic and solid-ui are now ESM-first, still providing UMD bundles.
• Only dist/, README, and license are published. Legacy .npmignore files were removed.
• Tests moved to test/, source to src/.

Improved Configurations

Across the 13 repositories, configurations for Babel, ESLint, TypeScript, and Webpack were unified and modernized, all adopting ESM-style .mjs configs.

Babel

• Targets browsers >1% share, last 3 versions, actively maintained.
• Optional TypeScript preset.

TypeScript

• Target: ES2019
• Libs: DOM + ES2019
• Module: ESNext
• Separate test configs

ESLint

Modernized ESLint setup with shared configs:

• Uses neostandard instead of @eslint/js.
• Removes @typescript-eslint plugin in favor of TS checks.
• Strict TS rules: strictNullChecks, noImplicitThis, alwaysStrict, noUnusedLocals. enforced through tsconfigs with complementary style rules for js.

Webpack

• UMD bundles for releases including minified versions.
• ESM bundles for solid-logic and solid-ui.
• Browser mappings for Node modules.
• Explicit externals for rdflib/solid-logic/solid-ui.
• Dev configs include source maps and alias mappings. For a full example, see the development files and dev webpack configuration in profile-pane.

Jest

Updated configuration with improved coverage and module mappings.

Working with .ttl Files

Repositories now use babel-plugin-inline-import instead of Makefile preprocessing. Used in: solid-panes, profile-pane, contacts-pane, meeting-pane.

Aligned Build Process

• Standardized scripts: clean, build, lint, lint-fix, test, test-coverage, typecheck, prepublishOnly, preversion, postpublish.
• Type checking, TypeScript compilation, Webpack bundling or Babel transpilation, declaration generation.

Dependencies & CI/CD

• Dropped support for Node 18.
• Removed unused dependencies, added missing ones.
• Moved rdflib, solid-logic, and solid-ui to peerDependencies.
• Unified GitHub Actions publishing.
• Removed husky, lint-staged, and legacy release.yml.
• Additional configurations: dependabot dependency updates and merges upon green builds.

Code Fixes

• Improved solid-logic singleton and exported missing types.
• Improved solid-ui exports.

• Small pane fixes

  • activitystreams-pane: many null checks added
  • contacts-pane: improved null and type checking
  • folder-pane: added user-auth checks
  • meeting-pane: replaced var with const, migrated from require → import

Conclusion

Mashlib and its repositories now target modern browsers, ship ESM bundles, and support tree-shaking.

Ideas for the Future

• Create shared org-level config packages.
• Streamline build processes further.
• Automated Mashlib release orchestration.

And finally…