ZjsComponent: A Pragmatic Approach to Modular, Reusable UI Fragments for Web Development

• URL: http://arxiv.org/abs/2506.11016v1
• Date: Sun, 04 May 2025 08:57:31 GMT
• Title: ZjsComponent: A Pragmatic Approach to Modular, Reusable UI Fragments for Web Development
• Authors: Lelanthran Manickum,
• Abstract summary: ZjsComponent is a lightweight and framework-agnostic web component designed for creating modular, reusable UI elements.<n>ZjsComponent does not require build-steps, transpiling, pre-compilation, any specific ecosystem or any other dependency.
• Score: 0.0
• License: http://creativecommons.org/licenses/by-sa/4.0/
• Abstract: In this paper, I present ZjsComponent, a lightweight and framework-agnostic web component designed for creating modular, reusable UI elements with minimal developer overhead. ZjsComponent is an example implementation of an approach to creating components and object instances that can be used purely from HTML. Unlike traditional approaches to components, the approach implemented by ZjsComponent does not require build-steps, transpiling, pre-compilation, any specific ecosystem or any other dependency. All that is required is that the browser can load and execute Javascript as needed by Web Components. ZjsComponent allows dynamic loading and isolation of HTML+JS fragments, offering developers a simple way to build reusable interfaces with ease. This approach is dependency-free, provides significant DOM and code isolation, and supports simple lifecycle hooks as well as traditional methods expected of an instance of a class.

Related papers

• ComUICoder: Component-based Reusable UI Code Generation for Complex Websites via Semantic Segmentation and Element-wise Feedback [38.10354940578983]
  We introduce ComUICoder, a semantic-aware code generation tool for complex websites.<n>ComUICoder significantly improves overall generation quality and code reusability on complex multipage websites.
  arXiv  Detail & Related papers  (2026-02-22T17:17:16Z)
• EmbeWebAgent: Embedding Web Agents into Any Customized UI [3.034887612600091]
  We present EmbeWebAgent, a framework for embedding agents directly into existing UIs.<n>It supports mixed-granularity actions ranging from primitives to higher-level composites.<n>Our demo shows minimal retrofitting effort and robust multi-step behaviors grounded in a live UI setting.
  arXiv  Detail & Related papers  (2026-02-16T15:59:56Z)
• Orcheo: A Modular Full-Stack Platform for Conversational Search [47.442398131910544]
  Conversational search (CS) requires a complex software engineering pipeline that integrates query reformulation, ranking, and response generation.<n>We introduce Orcheo, an open-source platform designed to bridge this gap.
  arXiv  Detail & Related papers  (2026-02-16T12:56:57Z)
• AICC: Parse HTML Finer, Make Models Better -- A 7.3T AI-Ready Corpus Built by a Model-Based HTML Parser [54.623900859999424]
  We introduce MinerU-HTML, a novel extraction pipeline that reformulates content extraction as a sequence labeling problem.<n>On MainWebBench, our benchmark of 7,887 annotated web pages, MinerU-HTML 81.8% ROUGE-N F1 compared to Trafilatura's 63.6%, with exceptional structured element preservation.
  arXiv  Detail & Related papers  (2025-11-20T14:15:23Z)
• From OCL to JSX: declarative constraint modeling in modern SaaS tools [3.1662160826016765]
  JSX is a declarative, functional subset of JavaScript/TypeScript used in the React ecosystem.<n>OCL.js, a JavaScript-based implementation of the Object Constraint Language, offers a web aligned approach to model validation.<n>We show JSX provides broader and better fits front-end-first architectures, indicating a promising path for constraint specification in modern modeling tools.
  arXiv  Detail & Related papers  (2025-09-22T11:37:15Z)
• Improving Front-end Performance through Modular Rendering and Adaptive Hydration (MRAH) in React Applications [0.0]
  We propose a pattern combining a modular rendering pipeline with an adaptive hydration strategy to optimize performance in React and Next.js applications.<n>The approach breaks the interface into distinct modules that can be rendered and hydrated independently.<n>By reducing the amount of JavaScript executed on page load and by scheduling work intelligently, this architecture aims to improve key performance metrics.
  arXiv  Detail & Related papers  (2025-04-04T19:11:30Z)
• Piece it Together: Part-Based Concepting with IP-Priors [52.01640707131325]
  We introduce a generative framework that seamlessly integrates a partial set of user-provided visual components into a coherent composition.<n>Our approach builds on a strong and underexplored representation space, extracted from IP-Adapter+.<n>We also present a LoRA-based fine-tuning strategy that significantly improves prompt adherence in IP-Adapter+ for a given task.
  arXiv  Detail & Related papers  (2025-03-13T13:46:10Z)
• DitHub: A Modular Framework for Incremental Open-Vocabulary Object Detection [48.257506587226324]
  We introduce DitHub, a framework designed to build and maintain a library of efficient adaptation modules.<n>Inspired by Version Control Systems, DitHub manages expert modules as branches that can be fetched and merged as needed.<n>Our method achieves state-of-the-art performance on the ODinW-13 benchmark and ODinW-O, a newly introduced benchmark designed to assess class reappearance.
  arXiv  Detail & Related papers  (2025-03-12T11:15:34Z)
• Boostlet.js: Image processing plugins for the web via JavaScript injection [1.6788471105762233]
  Boostlet.js provides an open-source, JavaScript-based web framework to enable image processing functionalities. Examples include kernel filtering, image captioning, data visualization, segmentation, and web-optimized machine-learning models.
  arXiv  Detail & Related papers  (2024-05-13T15:57:19Z)
• Harnessing customized built-in elements -- Empowering Component-Based Software Engineering and Design Systems with HTML5 Web Components [1.7094064195431142]
  Customized built-in elements in HTML5 significantly transform web development. These elements enable developers to create unique HTML components tailored with specific design and purpose. This study investigates the role of these features in Component-Based Software Engineering (CBSE) and Design Systems.
  arXiv  Detail & Related papers  (2023-11-28T08:42:53Z)
• EGFE: End-to-end Grouping of Fragmented Elements in UI Designs with Multimodal Learning [10.885275494978478]
  Grouping fragmented elements can greatly improve the readability and maintainability of the generated code. Current methods employ a two-stage strategy that introduces hand-crafted rules to group fragmented elements. We propose EGFE, a novel method for automatically End-to-end Grouping Fragmented Elements via UI sequence prediction.
  arXiv  Detail & Related papers  (2023-09-18T15:28:12Z)
• DynaMITe: Dynamic Query Bootstrapping for Multi-object Interactive Segmentation Transformer [58.95404214273222]
  Most state-of-the-art instance segmentation methods rely on large amounts of pixel-precise ground-truth for training. We introduce a more efficient approach, called DynaMITe, in which we represent user interactions as-temporal queries. Our architecture also alleviates any need to re-compute image features during refinement, and requires fewer interactions for segmenting multiple instances in a single image.
  arXiv  Detail & Related papers  (2023-04-13T16:57:02Z)
• Composing Complex and Hybrid AI Solutions [52.00820391621739]
  We describe an extension of the Acumos system towards enabling the above features for general AI applications. Our extensions include support for more generic components with gRPC/Protobuf interfaces. We provide examples of deployable solutions and their interfaces.
  arXiv  Detail & Related papers  (2022-02-25T08:57:06Z)
• CoVA: Context-aware Visual Attention for Webpage Information Extraction [65.11609398029783]
  We propose to reformulate WIE as a context-aware Webpage Object Detection task. We develop a Context-aware Visual Attention-based (CoVA) detection pipeline which combines appearance features with syntactical structure from the DOM tree. We show that the proposed CoVA approach is a new challenging baseline which improves upon prior state-of-the-art methods.
  arXiv  Detail & Related papers  (2021-10-24T00:21:46Z)
• LayoutTransformer: Layout Generation and Completion with Self-attention [105.21138914859804]
  We address the problem of scene layout generation for diverse domains such as images, mobile applications, documents, and 3D objects. We propose LayoutTransformer, a novel framework that leverages self-attention to learn contextual relationships between layout elements. Our framework allows us to generate a new layout either from an empty set or from an initial seed set of primitives, and can easily scale to support an arbitrary of primitives per layout.
  arXiv  Detail & Related papers  (2020-06-25T17:56:34Z)
• MixingBoard: a Knowledgeable Stylized Integrated Text Generation Platform [32.50773822686633]
  MixingBoard is a platform for building demos with a focus on knowledge grounded stylized text generation. A user interface for local development, remote access, a webpage API are provided to make it simple for users to build their own demos.
  arXiv  Detail & Related papers  (2020-05-17T20:29:27Z)
• Plato Dialogue System: A Flexible Conversational AI Research Platform [64.82999992143448]
  Plato is a flexible Conversational AI platform written in Python that supports any kind of conversational agent architecture. Plato has been designed to be easy to understand and debug and is agnostic to the underlying learning frameworks that train each component.
  arXiv  Detail & Related papers  (2020-01-17T18:27:29Z)

This list is automatically generated from the titles and abstracts of the papers in this site.

This site does not guarantee the quality of this site (including all information) and is not responsible for any consequences.