Introducing Spaces: Build collaborative environments in a few lines of code
Tags: webdev, news, javascript, programming
Published: 2023-09-11 13:39:52

**Spaces comes with a purpose-built SDK to enable developers to add a collaborative environment around existing applications.**

We are very excited to announce a new product — Spaces! 

The [Spaces SDK](https://www.ably.com/spaces) comes with an intuitive set of APIs that allow you to build realtime collaboration features such as avatar stacks, live cursors, member location and component locking, in days. Each API is optimized for their specific use-case, reducing integration effort.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/aidlg30sqzw8gtpnf365.gif)

## Spaces at a glance

- **Feature specific APIs:** The only product that comes with purpose-built, realtime collaboration APIs for adding avatar stacks, member location, live cursors, and component locking. All APIs are optimized for top performance. For example, the live cursors API automatically batches pointer position events to avoid unnecessary streaming of messages whilst ensuring negligible latency.
- **Easy to use:** Spaces is a simple and intuitive SDK that can be used with any web application.
- **High performing:** Powered by our market-proven, realtime infrastructure that’s built for reliability at scale, backed by five nines SLAs and messaging guarantees.
- **Realtime experiences unlocked:** Spaces is built to work with Ably’s other complementary products like Pub/Sub Channels to unlock end-to-end realtime messaging throughout your app. While Spaces powers the features you need to enable synchronous collaboration for teams and manage their participant state, Pub/Sub channels allows you to flexibly broadcast and sync app state changes between members, your backend and any other pieces in your system design.

## Enhancing your product with in-app collaboration & Spaces

With the [Spaces SDK](https://www.ably.com/spaces) you can set up a collaborative environment on any part of your application (or your entire application) so that collaborators have contextual awareness of what everyone is up to. Members of a space can see which other members are online, what they are looking at, their location within the app (this could be a cell, a page, a slide or a folder) and any specific component they’ve locked for editing. All of this and more in just a few lines of code.  No need to change your existing system design or app architecture. No realtime infrastructure to build and maintain to scale the collaboration to millions of virtual spaces and users.

## SDK feature highlights

Here’s the full set of APIs available in the beta release with many more planned:

- **Space:** A virtual collaborative space set up on your application where members can collaborate with each other in realtime.
- **Members:** Online users connected to the virtual collaborative space. This powers an [avatar stack](https://ably.com/examples/avatar-stack) for end users which is a visual representation of a member’s presence - showing them as online and connected.
- **Member location:** The [live location](https://examples.ably.dev/member-location) of a user within the app - page, cell, slide, block or anything else that makes sense for your application.
- **Live cursor:** The pointer location of members in a virtual space showing what they are looking at. The [live cursor API](https://ably.com/examples/live-cursors) automatically batches messages and provides the message rate required for smooth performance of 100s of simultaneous cursors (though we don’t recommend going beyond 15 for a good user experience).
- **Component locking:** Enables end-users to [lock specific UI](https://examples.ably.dev/component-locking) components while making their edits, so there’s no confusion with other collaborators or disruption to overall collaboration in the space.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3wojtd9khrgzjc0a9x4k.png)

## Get started today

Spaces is currently available in beta. To get started simply

- Sign-up for a [free developer account](https://ably.com/sign-up)
- Take a closer look at [Spaces](http://www.ably.com/spaces)
- Dive into the [Spaces docs](https://ably.com/docs/products/spaces)
- Sign-up for [the webinar](https://pages.ably.com/collaborative-spaces-webinar)