🚦 Core Web Vitals Power Toy for Magento 2 by JaJuMa

Core Web Vitals Power Toy for Magento 2 by JaJuMa is a dashboard toy that displays Core Web Vitals for current page load.
Powered by Google web-vitals library for measuring Web Vitals metrics.

Compatible with

Hyvä Themes	Mage-OS	Magento

Features

This Dashboard Power Toy provides:

• Core Web Vitals and other performance KPI measured for current page load with
  • CLS – Content Layout Shift
  • LCP – Largest Contentful Paint
  • INP – Interaction to Next Paint
  • FID – First Input Delay
  • FCP – First Contentful Pain
  • TTFB – Time To First Byte

(Note: This Toy only shows in frontend)

Screenshots

Core Web Vitals Toy Dark Mode	Core Web Vitals Toy Light Mode

Requirements

‼️ This module requires Power Toys for Magento 2 ‼️ by JaJuMa

• Magento Power Toys v1.0.0+
• Magento v2.4.5+ OR
  Mage-OS v1.0.0+
• Magewire v1.10+
• Magewire-requirejs v1.1+

Further Info, Extension Description & Manual

• Extension Website EN
• Extension Website DE

Demos

• Magento Power Toys Demo on Luma Theme
• Magento Power Toys Demo on Hyvä Theme
• Magento Power Toys Demo on Mage-OS

Installation

Install via composer as any other Magento extension from Github:

composer require jajuma/pot-core-web-vitals

Using Core Web Vitals Power Toy For Magento

After installing this module:
Go to
JaJuMa -> Power Toys -> Configuration
and enable & configure Core Web Vitals Toy.

After enabling, see the floating button at left/right edge of your screen in your Frontend (while logged in as Admin).
When click on this button, the Power Toys Panel will open displaying the Core Web Vitals Toy. (Note: this Toy only shows in frontend)

• See Manual for more details

License

The code is licensed under the MIT License (MIT)

❤️ Powered by

Developing the Power Toys module and the toys was a lot easier and more fun thanks to Magewire.
A big shout and Thank You to Willem Poortman for creating Magewire

Other Magento 2 Extensions by JaJuMa

• 🖼️ Performance & UX:
  Ultimate Image Optimizer for Magento 2
  AVIF & WebP Images, Lazy Loading, High-Resolution / Retina images

• 🖼️ Performance & UX:
  WebP Optimized Images for Magento 2
  The #1 WebP Images Solution for Magento 2

• 🙈 SEO:
  PRG Pattern Link Masking for Magento 2
  Link Masking for Layered Navigation

• 👮 User Experience:
  Shariff Social Share for Magento 2
  GDPR compliant and customizable Sharing Buttons

• 🎥 Content Management:
  Video Widget for Magento 2
  Embedding YouTube videos, GDPR compliant with auto preview image & fully responsive

• 🚀 Performance & UX:
  Page Preload for Magento 2
  Faster faster page transitions and subsequent page-loads by preloading / prefetching

• 📈 Marketing:
  Matomo Analytics for Magento 2
  Web Analytics - GDPR Compliant

• 🍯 Site Optimization:
  Honey Spam Anti-Spam for Magento 2
  Spam Protection - Reliable & GDPR Compliant

• 🔔 Marketing:
  Customer Registration Reminder & Cleanup for Magento 2
  Increase Your Customer Engangement & Cleanup your Customer Account Data Automatically

• 📣 UX & Marketing:
  Category Grid Callouts for Magento 2
  Enrich Your Category Grids With Eye-Catching Callouts

• 💭 UX & Marketing:
  Customer Satisfaction Feedback for Magento 2
  Collect Valuable Feedback From Your Customers & Understand How To Satisfy Your Customers

• 🎇 UX:
  Auto Select Options for Magento 2
  Automatically Select Configurable & Custom Options Based On Your Customer's Preferences

• ↔️ UX & Performance:
  Back Forward Cache - bfcache for Magento 2
  Enable bfcache for Magento 2 for improved UX & Core Web Vitals

• ➗ Accounting:
  Dynamic Shipping Tax Plus for Magento 2
  Dynamic Shipping Tax Calculation incl. pro-rata/proportional tax rates

• 🔍 Search:
  MySQL Search for Magento 2
  MySQL Search for Magento 2 without Elasticsearch

• ‼️ Performance:
  Preload Critical Resources & Assets
  Resource Hints for preloading important and critical resources

• Content Management:
  git 4 Page Builder
  Manage & deploy Magento 2 Page Builder content via git

• 🚀 Performance:
  Hyvä Inline CSS
  Run Magento 2 without CSS file by inline all CSS

• 👨‍💻 🆓 Content Management:
  Syntax Highlighter 4 Page Builder
  Syntax Highlighting and more for Magento 2 Page Builder

• 🚩 🆓 UI & UX:
  Awesome Hyvä for Hyvä Themes
  Font Awesome 5 & 6 Icons for your Hyvä Themes Store

• 🚩 🆓 UI & UX:
  Hyvä Flags for Hyvä Themes
  Country & Language Flag Icons for your Hyvä Themes Store

• 🙆‍♂️ 🆓 User Experience:
  Customer Navigation Manager for Magento 2
  Easily manage the links in your Customer Account

• ➗ 🆓 Accounting:
  Dynamic Shipping Tax for Magento 2
  Dynamic Shipping Tax Calculation

• ❓ 🆓 Content:
  Hyvä FAQ Widget for Hyvä Themes
  FAQ Widget for your Hyvä Themes Store

Other Services by JaJuMa

• 🛍️ JaJuMa-Market: Marketplace Software
  Complete Online Marketplace Software Solution. For Professional Demands. Feature Rich. Flexibly Customizable.

• 🛒 JaJuMa-Shop
  Customized Magento Shop Solutions.

• 🚀 JaJuMa-Shop: Hyvä Magento Shop Development
  Hyvä Magento Shop Development.

• 📙 JaJuMa-Shop: Magento Handbuch in Deutsch
  Magento Handbuch in Deutsch.

• 🗂️ JaJuMa-PIM
  Product Information Management. Simple. Better.

• ➕ JaJuMa-Develop: Magento 2 Extensions
  Individual Solutions For Your Business Case.

• 🖌️ JaJuMa-Design
  Designs That Inspire.

• 👔 JaJuMa-Consult
  We Show You New Perspectives.

© JaJuMa GmbH | www.jajuma.de