From OCL to JSX: declarative constraint modeling in modern SaaS tools

2025-09-22

AI Summary

OCL.js exhibits incomplete standard coverage, low adoption, and poor integration with modern frontend toolchains in SaaS modeling environments. Method: This paper proposes replacing OCL.js with JSX—a declarative JavaScript/TypeScript syntax—for model constraint specification. It introduces JSX to constraint modeling for the first time, leveraging its functional and component-based paradigm to enable inductive syntax definition, constraint-aware code generation, and dynamic querying, while natively supporting frontend-first architectures. A client-side constraint expression and execution framework is implemented atop the React ecosystem. Contribution/Results: Empirical evaluation demonstrates that JSX delivers superior expressiveness over OCL.js on representative modeling examples and significantly improves integration with contemporary frontend tools—including TypeScript, Vite, and ESLint—thereby enhancing developer productivity and tooling consistency.

Technology Category

• Constraint Satisfaction and Optimization: Satisfiability Modulo Theories
• Knowledge Representation and Reasoning: Description Logics
• Application Domains: Humanities & Computational Social Science

Application Category

• Graph Algorithms and Modeling for the Web: Foundation models and LLMs for Web-related graphs
• Semantics and Knowledge: Data modeling to support human-machine intelligence, including LLMs agents, intelligent system behavior, explanations, and user-friendly interactions
• Responsible Web: Consent frameworks and practices on the web

Abstract

The rise of Node.js in 2010, followed by frameworks like Angular, React, and Vue.js, has accelerated the growth of low code development platforms. These platforms harness modern UIX paradigms, component-based architectures, and the SaaS model to enable non-experts to build software. The widespread adoption of single-page applications (SPAs), driven by these frameworks, has shaped low-code tools to deliver responsive, client side experiences. In parallel, many modeling platforms have moved to the cloud, adopting either server-centric architectures (e.g., GSLP) or client-side intelligence via SPA frameworks, anchoring core components in JavaScript or TypeScript. Within this context, OCL.js, a JavaScript-based implementation of the Object Constraint Language, offers a web aligned approach to model validation, yet faces challenges such as partial standard coverage, limited adoption, and weak integration with modern front-end toolchains. In this paper, we explore JSX, a declarative, functional subset of JavaScript/TypeScript used in the React ecosystem, as an alternative to constraint expression in SaaS-based modeling environments. Its component-oriented structure supports inductive definitions for syntax, code generation, and querying. Through empirical evaluation, we compare JSX-based constraints with OCL.js across representative modeling scenarios. Results show JSX provides broader expressiveness and better fits front-end-first architectures, indicating a promising path for constraint specification in modern modeling tools.

Problem

• Addressing challenges of OCL.js for model validation in web environments
• Exploring JSX as alternative constraint expression in SaaS modeling tools
• Comparing constraint approaches for modern front-end first architectures

Innovation

• JSX replaces OCL.js for constraint modeling
• JSX enables declarative functional constraints in React
• JSX offers broader expressiveness for front-end architectures