Introduction to the Framework

The framework is a Typescript based front end tool that allows us to build apps that are suitable for the browser, mobile (via Infinity Studio) and desktop (via Electron). It's designed to allow for rapid development of apps whilst also allowing for easy sharing of code and functionality.

At its core, the framework is powered by web components. Every UI widget you see or interact with is some kind of component. The framework gives you the tools to wire up these components to create a complex and flexible UI, as well as the power to create your entire application.

History

The framework was developed whilst working on the Incident and Pager applications to allow us to build apps more effectively. We never set out to "build" a framework directly; these apps just needed to use a common "base" of functionality which over time has evolved into the framework.

When building these apps we have a few guiding principles that needed to be followed:

• We had to use web components
• Anything we built had to work in the CommonTime Infinity Studio
• We couldn't introduce too many new technologies

The main constraint was ensuring that what we built would work in the Studio. This meant we ruled out using third party frameworks like React, Vue, etc, as they would be too hard to bring into a CTI app.

As we had to use web components, we decided on using the library Skate.js to handle the component rendering. This gave us a few advantages over traditional web component development:

• Skate.js provided a Virtual DOM ontop of the standard web component spec, allowing for faster and more efficient rendering.
• Skate.js provides an API for property watching and dynamic re-rendering out of the box, allowing us to build complex components easily.
• We could build our components using JSX and leverage some of the features that makes React easy to use.

We found building these two apps to be fast and fun. As we continued to develop, more tools were brought in and eventually we had something that resembled a framework.

Since then, the framework has been brought into PSO and rapidly evolved to include lots of new features such as routing, http and web socket modules as well as tools like the application generator and VS Code extensions.

Framework Development

It's worth noting that the development of the framework is not actively maintained by one person. Instead, it is up to everyone in PSO to improve and contribute to make the framework better. Suggestions are always welcome.