STN Video Performance
Web vitals improvements for STN Videos.
Install
No release zip yet. The repository archive installs, but the folder name will carry the branch suffix and updates will not flow:
wp plugin install https://github.com/xwp/stn-video-performance/archive/refs/heads/main.zipReadme
STN Video Performance
A lightweight WordPress plugin that extends the sendtonews plugin to provide performance optimizations for STN Videos.
Features
- Hide Featured Video Player Meta Box: Provides an option to hide the Featured Video Player meta box from post and page edit screens, improving editor performance by preventing unnecessary script loading.
- Video Player Load Delay: Delays loading of STN Video player scripts to prioritize critical page resources and improve initial page load performance.
- CLS Prevention: Applies inline CSS to video player containers to prevent layout shift during video load, using aspect-ratio preservation and placeholder backgrounds.
- Video Thumbnail Placeholders: Automatically displays video thumbnails as background images while the player loads, providing visual continuity and improved user experience (requires STN Video Meta plugin), which also doubles as LCP optimization.
Installation
Using Composer
To install the plugin via Composer, follow these steps:
-
Add the Repository:
-
Open your project's
composer.jsonfile. -
Add the following under the
repositoriessection:"repositories": [ { "type": "vcs", "url": "https://github.com/xwp/stn-video-performance" } ]
-
-
Require the Plugin:
-
Run the following command in your terminal:
composer require xwp/stn-video-performance
-
-
Activate the Plugin:
- Once installed, activate the plugin through the 'Plugins' menu in WordPress.
-
Configure the Plugin
- Navigate to Settings > STN Video to configure the plugin
Manual Installation
- Download the Plugin:
- Download the
stn-video-performanceplugin folder.
- Upload the Plugin:
- Add the
stn-video-performancefolder to the/wp-content/plugins/directory of your WordPress installation.
- Activate the Plugin:
- Activate the plugin through the 'Plugins' menu in WordPress.
- Configure the Plugin
- Navigate to Settings > STN Video to configure the plugin
Usage
All settings are configured on the Settings > STN Video page in your WordPress admin, in the Performance Options section (appears above the STN Video settings).
Hiding the Featured Video Player Meta Box
- Go to Settings > STN Video in your WordPress admin, at the Performance Options section
- Check the box labeled "Hide Featured Video Player meta box from post and page edit screens"
- Click "Save Performance Settings"
When enabled:
- The Featured Video Player meta box will not appear on post/page edit screens
- Editor performance will be improved by not loading unnecessary scripts
- Existing video metadata will be preserved and videos will continue to display on the frontend
- The setting can be reversed at any time by unchecking the box
Delaying Video Player Script Loading
- Go to Settings > STN Video in your WordPress admin, at the Performance Options section
- Set the "Video Player Load Delay" value in milliseconds (recommended: 1000-3000ms)
- Click "Save Performance Settings"
When configured:
- Video player scripts will load after the
window.loadevent plus the configured delay - Critical page resources will load first, improving perceived page speed
- The STN Video player container (
<div>) remains in place with CLS prevention styling - Video thumbnails are displayed as placeholder backgrounds during load (when available)
- Set to
0to disable delayed loading and load scripts immediately - The delay applies only to frontend pages where the
[sendtonews]shortcode is used
Technical Details
This plugin integrates seamlessly with the STN Video plugin:
Settings Integration
- Uses the
sendtonews_settings_enqueueaction to render a separate Performance Options form on the STN Video settings page - Has its own form submission handler with proper nonce verification and capability checks
- All settings are stored separately in the
stn_video_performance_settingsWordPress option (not autoloaded for performance)
Meta Box Removal
- Uses
remove_meta_box()with priority 999 on theadd_meta_boxeshook to remove the meta box after STN Video registers it - Leverages the
stnvideo_featured_video_screensfilter to dynamically determine which post types to remove the meta box from
Delayed Script Loading
- Hooks into
do_shortcode_tagwith thesendtonewsshortcode for efficient, targeted processing - Only processes pages where the
[sendtonews]shortcode is present (not all content) - Extracts the script URL from the shortcode output using regex pattern matching
- Enforces HTTPS on protocol-relative URLs and validates all script URLs with
esc_url_raw() - Replaces the original `