Leap streamlines your website speed optimization with a wide array of features, all within a single tool, eliminating the need for multiple plugins. Below are the detailed explanations of the features included in Leap:
CSS Optimization:
- Remove Unused CSS: This function removes any CSS not used by the current page and serves a minified version of the remaining CSS, resulting in smaller page sizes and faster loading times.
- Remove Unused CSS by Page: Similar to the overall Remove Unused CSS function, this feature works on each individual URL, serving a minified version of the CSS used on that specific URL. NOTE that enabling this feature may slow down actual user experience if most pages use the same set of CSS, as users will have to download a new file for each page they visit.
- Optimize Fonts & Preload Fonts: These features optimize fonts declared in the inline stylesheet to prevent flashes as fonts load and combine multiple font API calls into one request. Additionally, preloading fonts found in external CSS files ensures they are ready to be displayed more quickly without blocking page rendering.
Image Optimization:
- Lazy Loading of Images: This feature helps your site load faster by only loading images when the user will actually see them. Images lower on the page load as the user scrolls down.
- Next-Gen Formats: In supported browsers, this feature serves images in WebP format, a new image format designed for smaller file sizes.
- Resize Images: Automatically resizes images on your page based on the user's screen size to minimize transfer times while maintaining image quality.
- Preload Background Images: Adds preload tags for background images defined in inline stylesheets, which should speed up the loading of large images defined as backgrounds.
- Set Explicit Width and Height: Sets the Width and Height attributes on image tags that lack them, without affecting tags that already have these attributes set.
Static Asset Cache Policy:
This feature tells the browser to cache your static assets, increasing your site's speed by eliminating the need for users to download those assets more than once. The available static assets that can be cached include images, stylesheets, scripts, and fonts. Efficient Static Cache Policy can also be disabled on specific elements using the specified selector.
Pre-connect:
- Pre-connect Origins: Parses your page to identify other domains from which assets are requested and adds tags to tell the browser to pre-connect to those domains, speeding up asset loading.
Minification:
- Minify Javascript:Removes unnecessary whitespace, comments, and characters from JavaScript files to minimize javascript payload size, reducing the time to send the file to the user.
- Minify CSS: Remove unnecessary whitespace, comments, and characters from the CSS files to minimize CSS payload size, reducing the time to send the file to the user.
- Minify HTML: Remove unnecessary whitespace, attributes comments and characters from the HTML to minimize page size, reducing the time to send the page to the user.
Note that you have the option to 'keep' certain HTML from being minified.
Script Execution:
- Script Delay: Delays the loading and execution of Javascript until the primary content has loaded. You can set specific URL rules to exclude certain scripts, pages, or directories from script delay.
- Reduce CPU Intensive Tasks: Slows down JavaScript tasks that are using too much CPU, allowing the browser's processor to have free time to render the page.
- Disable Ads Above The Fold: Improves page performance and Core Web Vitals by removing ads above the fold, though it might decrease revenue if many visitors do not scroll down the page.
- jQuery Loading Method: Core jQuery Feature Preload and loading jQuery from a global CDN to ensure more users have it cached.
Content Optimization:
- Lazy Load Iframes: This feature allows lazy loading of iframes appearing outside the initial screen view, helping the site load faster.
- Remove Scripts or Styles: Allows testing of removing specific scripts or style tags from your site.
- Lazy Load YouTube Videos: Lazy loads YouTube embedded videos without loading extra YouTube content until played by the viewer, speeding up page load times. Recommended for sites with YouTube content in the initial screen view or considering transitioning to Humix for optimized video content and site performance.
With these comprehensive optimizations, Leap ensures that your users interact with your pages significantly faster while essential elements load seamlessly in the background.