Integrate Web Profiler Widget for Yves

Last updated:
Edit on GitHub

The Web Profiler Widget provides a toolbar for debugging and for informational purposes. The toolbar is located at the bottom of a loaded page.

The widget is based on Symfony Profiler. For details, see Profiler documentation.

Modules

The following modules provide the profiler functionality:

  • WebProfilerWidget -spryker-shop/web-profiler-widget
  • WebProfilerExtension -spryker/web-profiler-extension

Installation

Install WebProfilerWidget and the extension module:

composer require spryker-shop/web-profiler-widget --dev

Integration

To be able to use the Web Profiler Widget, add \SprykerShop\Yves\WebProfilerWidget\Plugin\Application\WebProfilerApplicationPluginof thespryker-shop/web-profiler-widgetmodule to \Pyz\Yves\ShopApplication\ShopApplicationDependencyProvider::getApplicationPlugins().

Configure WebProfilerWidget per environment

The below options can be used in the Router to configure WebProfilerWidget. The options are contained in \SprykerShop\Shared\WebProfilerWidget\WebProfilerWidgetConstants.

  • \SprykerShop\Shared\WebProfilerWidget\WebProfilerWidgetConstants::IS_WEB_PROFILER_ENABLED- use this option to enable/disable WebProfilerWidget. By default, the widget is disabled.
  • \SprykerShop\Shared\WebProfilerWidget\WebProfilerWidgetConstants::PROFILER_CACHE_DIRECTORY- use this option to specify the path where the WebProfiler stores its cache.

Extending WebProfilerWidget

You can extend WebProfiler with the \Spryker\Shared\WebProfilerExtension\Dependency\Plugin\WebProfilerDataCollectorPluginInterface interface. It can be used for adding Data Collectors to the profiler.

Individual Data Collectors can be added to \Pyz\Yves\WebProfilerWidget\WebProfilerWidgetDependencyProvider::getDataCollectorPlugins().

Spryker provides a lot of build-in collectors. You can locate them in WebProfilerWidget/src/SprykerShop/Yves/WebProfilerWidget/Plugin/WebProfiler/.

Additional collectors

Starting from version 3.17.0, the spryker/zed-request module allows you to collect data about all the requests to Zed sent from Yves. To enable the data collection, add \Spryker\Yves\ZedRequest\Plugin\WebProfiler\WebProfilerZedRequestDataCollectorPlugin to the stack returned by \Pyz\Yves\WebProfilerWidget\WebProfilerWidgetDependencyProvider::getDataCollectorPlugins().

If you are using the key-value store (Redis or Valkey) as storage, you can track the calls to it as well. Starting from the redis version 2.4.0, the new data collector plugin \Spryker\Yves\Redis\Plugin\WebProfiler\WebProfilerRedisDataCollectorPlugin is available for that matter. To track calls to the key-value store (Redis or Valkey), add this plugin to \Pyz\Yves\WebProfilerWidget\WebProfilerWidgetDependencyProvider::getDataCollectorPlugins().

Same goes for Elasticsearch. Make sure your version of spryker/search-elasticsearch is 1.8.0 and add \Spryker\Yves\SearchElasticsearch\Plugin\WebProfiler\WebProfilerElasticsearchDataCollectorPlugin to \Pyz\Yves\WebProfilerWidget\WebProfilerWidgetDependencyProvider::getDataCollectorPlugins() to track calls to Elasticsearch.