Containers and Connectors

When working with Site Plugins, there are two components that are necessary for getting content on the webpage: containers and connectors.

Containers hold all the site plugin information, as well as the placement element. They keep track of all the resources needed for a site plugin to be functional and uses the Connector at different lifecycle steps.

The Connector is the meat of any site plugin -- it's the JavaScript object that takes a Container and fills it with content. Connectors must meet certain criteria to work correctly with Containers.

The Web SDK uses Containers internally to track resources and their usage, while it's entirely up to the developer to write Connectors the way they want.

Containers

Container instances have the following attributes:

Attribute	Description
el	The element to render content inside of
styles	An array of styles installed (by name)
extensions	An object of name: extension extensions to add functionality to site plugins
config	The config object for the placement/site plugin
id	The ID of the placement/container

Connectors

Connectors should implement the following constructor and methods:

constructor(namespace)

The constructor takes in a namespace object. Use the namespace object if you want access to any Web SDK features directly.

connect(container)

The connect method is called once all requirements for an initial render are complete. This includes all extensions to be available and config to be populated.

onContent(manifest)

The onContent method is called whenever a piece of content is available for the site plugin. The manifest contains a list of objects standard to one of the three content types: static, native or third-party.

Connector Implementations

There are many considerations to take into account when writing your connector. However, the most important is rendering content into the DOM. There are many libraries and frameworks you can use, and they're all compatible with the Web SDK's connector interface. The Web SDK Namespace provides the lit module as a possible renderer pre-loaded for use.

Connectors, however, are not called "Renderers". This is because they may do much more than render content. In fact, the content may already exist, and the connector only alters the content or tags the content with attributes for tracking. Keep this in mind as you explore what you can do with Site Plugin Connectors.