Resources

Ɨ

Visual CMS

Drag-and-drop visual editor and headless CMS for any tech stack

Theme Studio for Shopify

Build and optimize your Shopify-hosted storefront, no coding required

Resources

Blog

Get StartedLogin

ā˜°

Forum

Blog

Github

Signup

Made in Builder

Qwik API

Beta

Our Qwik API is our new, ultra performance optimized alternative to our HTML API. It uses Qwik to prerender your content to optimized HTML that requires 0 JS to run (even if it has dynamic content!)

Status

This API is in beta. Please report issues in our forum. Current features not yet supported are custom components, impression and click tracking, and A/B testing.

Sample Request and Response

Try Out the Interactive API Explorer

What is Qwik

Qwik is a framework for rendering content that is focused on extremely fast site startup. Qwik achieves this in two parts:

  1. By delivering pure HTML of your content (nothing is faster than HTML)
  2. By transparently lazy loading the behavior (JavaScript) on an as-needed basis

Integration

To integrate Qwik into your site, you will need to do two things:

  1. Integrate qwikloader.js
  2. Integrate content fetching code.

Qwikloader

Qwik REST API delivers static HTML. To make the HTML interactive, Qwik requires a small (less than 1kb) library which needs to be included in your site.

Content Fetching

The next step is to download and inline the content into the HTML

Assume you have a <div id="my-content"></div> into which you would like to load the content.


If more than one content needs to be retrieved, repeat the above code for each content.

NOTE: The above code is vanilla JavaScript by design. The goal of Qwik is to be as lightweight as possible, and therefore, there are no expectations of existing libraries on your page.

Server Side Rendering

Qwik shines best with Server Side Rendering (SSR). Qwik REST API response can be cached in CDN and can be included in your SSR content. Qwik will automatically download additional JavaScript as needed to satisfy user interactions.

Example

You can try the above in StackBlitz.

Beta Limitations

Qwik is in beta and therefore comes with limitations. Below is a list of features that are not yet implemented but coming soon:

  • Support for registering components
  • Support for editing Builder content on the same URL as content served
  • Support for a/b testing
  • Support for insights/tracking

API Query Parameters

NameRequiredDescription

apiKey

Yes

Your API key

url

Yes

The current URL of the visitor on your site, e.g. ?url=https://your-site.com/about?foo=bar

includeUnpublished

No

Set to true to include unpublished content in your API response (e.g. for testing)

query.*

No

Mongodb style query of your data. E.g.:

fields

No

Only include these fields. E.g.

omit

No

Omit only these fields, E.g.:

userAttributes.*

No

Optionally use this to send targeting attributes, e.g.:

cacheSeconds

No

Seconds to cache content (sets the max-age of the cache-control header response header). Make higher for better performance, and lower for content that will change more frequently

Was this article helpful?