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

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.