Parallel Editing and Code Comparison for Co-Development in UIB
Rejoice, humans and bots alike—the day we've all been waiting for has finally arrived! You may not have realized it, but there’s one feature we’ve always wanted in our UI Builder: the ability for parallel development without overwriting others' changes. In the upcoming release, the UIB team is finally delivering this essential feature!
Parallel Editing
This functionality is currently available in xsr2. To utilize this feature, everyone should have access to parallel editing if the UIB is updated to xsr2 version. Here is an example of how it appears.
If two developers, System Administrator and Maint are logged in and working on the same page, they will see the edit screen as below:
Maint user will see:
Admin user will see:
If Maint user updates the page, admin user will see the message
On saving following pop up with text will appear:
If the admin saves the page, Maint user’s message will get updated to :
Benefits
This feature provides warnings and updates developers about edits made by others on the same page, saving time and reducing rework caused by code or configuration overrides.
Code Comparison for Co-Development in UIB
This initiative will be live on Ysr1/Ysr2 and it focuses on boosting collaboration and productivity in UI Builder by tackling issues with handling multiple contributions and tracking code changes. The main aim is to enhance developer efficiency through a code comparison feature that eases change detection, minimizes conflicts, and accelerates debugging and issue resolution, especially in complex, design-intensive projects with several developers working together.
Background and Problem Overview
This project aims to tackle collaboration issues for developers in shared coding environments like UI Builder. The absence of code comparison tools complicates change tracking, bug identification, and conflict resolution, leading to longer debugging sessions, more errors, and reduced productivity. While collaborative coding has always been challenging, the complexity in low-code systems like UI Builder exacerbates the problem, as it lacks built-in code comparison features, making manual tracking necessary and prone to mistakes. These issues are especially prominent in large, design-focused projects requiring consistent standards.
Hypothesis
Developers using code comparison can detect changes faster, leading to quicker resolution of bugs and reduced conflict during collaboration, demonstrating improved productivity and reduced error rates.
Target personas
- Primary: Pro-code developers using UI Builder.
- Secondary: Mid-skilled developers using UI Builder.
Customer Problem
I’m a developer working on a collaborative project, trying to maintain the integrity and functionality of a page. However, I’m struggling with tracking changes and avoiding conflicts because multiple developers are making edits without code comparison, which results in increased errors and confusion, leaving me frustrated.
Key Results
- Boost developer productivity by minimizing context switching between UI Builder and external platforms
- Speed up issue resolution by simplifying root cause identification
- Enhance ease-of-use for teams collaborating on the same page
Roadmap & Timeline
- Page Variant and Component-Level Comparison: Developers could compare individual components of a page across different versions. This could be integrated with the Now Experience components in UI Builder, making it easier to track changes to UI elements.
- Rollback Mechanism: UI Builder might offer rollback functionality, enabling users to restore a previous version of the page directly from the version comparison interface, minimizing the risk of errors introduced in recent updates.
- Sync and Unified Diff: Leveraging ServiceNow's integration with external development tools like the VS Code extension, developers can use unified diff capabilities to compare the current and previous states of pages before syncing changes.
