Page load speed optimization settings
Last updated
Was this helpful?
Last updated
Was this helpful?
There are several ways to include Setka Editor Styles on the page depending on particular CMS features (for example, on the site markup and how pages are loaded).
Three Setka Editor WordPress plugin settings can help with managing Styles for your page.
All Setka Editor styles will be loaded on the page as separate (standalone) files. This provides a balance between user experience and speed.
The example set of files:
File
URL
Description
Common
https://ceditor.setka.io/common_css/common_css_version.css
Setka component styles that are independent of a particular style and layout grid
Style
https://ceditor.setka.io/clients/company-id/css/style-id.css
Layout
https://ceditor.setka.io/clients/company-ID/layout_option_builds/company-id/layout-id.css
This will reduce the delay to display post content but might result in post content redraws after the full page load.
This way to include the styles that fit the best when someone would like to achieve the best score.
In the post there will be inlined critical Styles:
Compared to the previous default styles the size of CSS that is inlined is less than is being contained in separate (standalone) styles.
The example set of critical files:
File
URL
Description
Critical Common
https://ceditor.setka.io/common_css/common_css_critical_version.css
Setka component styles that are independent of a particular style and Layout Grid. Contains decoration for the basic components that with a high probability will be used to design the first screen of the post.
Critical Style
https://ceditor.setka.io/clients/company-id/css/style-id_critical.css
Layout
https://ceditor.setka.io/clients/company-id/layout_option_builds/company-id/layout-id.css
Inlined styles apply to Setka content as soon as it is loaded on-screen.
Moreover, there is a list of deferred styles that load asynchronously thus don’t block the page render. Deferred styles are the rest of the styles that are necessary for the content decoration and that were not included in the set of critical styles.
The example set of deferred files:
File
URL
Description
Deferred Common
https://ceditor.setka.io/common_css/common_css_deferred_version.css
Setka component styles that are independent of a particular style and Layout Grid. Contain decoration for the basic components that with a high probability will be NOT used to design the first screen of the post.
Deferred Style
This will increase the assets' size and might affect load speeds. Use only if you plan on displaying on a single page several Setka Editor posts in different styles that are loaded by JS. In this case, you need to have all the styles in one CSS to render multiple posts correctly.
The example file:
File
URL
Description
Combined Styles and Layouts
https://ceditor.setka.io/clients/company-ID/css/company-id_version.min.css
A file describing the particular design system (), that was used for the current post decoration
A file describing the particular , that was used for current post decoration
File describing the particular design system (), that was used for current post decoration. Contains decoration for the basic components that with a high probability will be used to design the first screen of the post.
A file describing the particular used for current post decoration. Layout styles can’t be divided into the critical and deferred styles as far as the post layout is one of the main things that determine the post appearance. So layout styles are inlined.
css/style-id_deferred.css
File describing the particular design system (), that was used for current post decoration. Contain decoration for the basic components that with a high probability will NOT be used to design the first screen of the post.
Rules for all the styles and grids of a company, created in