Hey, need help with your Magento, WooCommerce or Laravel project? I have some availalility. Contact me.

Using Webgrind with Warden

Warden, Magento 2, Magento 2 local environment, Webgrind

It seems like all the cool kids are using Blackfire these days, but there is a tool you already have installed in Warden that allows you to do the same: Xdebug. It is not as well known as Blackfire, but it allows you to profile your application.

The only downside is that it only generates the files that can be used to profile, but you need another tool to visualize it. This is where Webgrind comes in.

Configuring

Luckily for us, adding Webgrind to Warden is pretty easy. Just merge this code in your .warden/warden-env.yml file. Don't have that file? Then it's even easier, create the file and paste this code in.

version: "3.5"
services:
  webgrind:
    platform: linux/x86_64
    image: jokkedk/webgrind
    volumes:
      - type: volume
        source: tmp
        target: /tmp
        volume: { }
    labels:
      - traefik.enable=true
      - traefik.http.routers.${WARDEN_ENV_NAME}-webgrind.rule=Host(`webgrind.${TRAEFIK_DOMAIN}`)
      - traefik.http.routers.${WARDEN_ENV_NAME}-webgrind.tls=true
      - traefik.http.services.${WARDEN_ENV_NAME}-webgrind.loadbalancer.server.port=80

  php-debug:
    volumes:
      - type: volume
        source: tmp
        target: /tmp
        volume: { }

volumes:
  tmp:
    name: webgrind_tmp

Now, run warden env up and you should be able to access Webgrind by opening https://webgrind.your-configured-url.test.

How to profile?

If you have the Xdebug helper extension for Chrome/Firefox/Safari/whatever, it's quite easy. Just click enable the option and reload the page.

Then go back to Webgrind, reload the page, and pick one of the files from the list:

How does this work?

There are a few steps that make this work. Let's go over them. First of all there is defined which image to pull for Webgrind. In our case, that is jokkedk/webgrind . Then we tell Traefik that we have a new service available and on which URL this should be hosted. This allows you to visit https://webgrind.your-configured-url.test.

When Xdebug Profiling is enabled, a bunch of files is generated. Webgrind needs access to those files. So we add a volume that shares the /tmp folder, which is where Xdebug dumps it's files.

Does it work with other Docker solutions?

Probably, although .warden/warden-env.yml won't exist there. So you need to place it somewhere else, and that depends on the solution.

Want to respond?