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

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.