Tech Lead

TillväxtverketTech Lead

August 2023 to Present

I joined the team at Tillväxtverket to help launch the new version of the Verksamt website. The site provides information and services from several Swedish authorities, with the purpose of helping those who are starting or running a business.

The public-facing parts of the website, which are the ones I've been mostly involved in, is a Nuxt application at its core with a number of Nuxt modules mounted that contains the logic for the different parts of the site. The logged in parts are a traditional Vue.js SPA. The site is multilingual and uses i18n for translations.

Implementing Elasticsearch

Since it's a large site with a mix of editorial content, permits for different authorities and a lot of different services, the search functionality is a crucial part of the site.

My first task was to build this search functionality which consists of a frontend search module that communicates with a backend Elasticsearch cluster.

The search implementation is used in both the Nuxt application and in the Vue.js SPA, thus I built it as a Nuxt module as well as a Vue.js plugin while sharing the logic between them.

It was important that the search implementation was accessible, that it would be easy to maintain and flexible enough for a lot of different content types. I'm quite happy with how it turned out and look forward to further enhance it with new features going forward.

Improving content management

One thing I noticed when working with the editorial pages was that although the content was served from an API by a headless CMS, there were still parts that behaved like a traditional CMS.

To give developers a better experience and to improve the site performance, I built a parser that converts the traditional CMS content into a structured content model.

This makes it possible to decouple formatting from the CMS and ensure that developers can decide exactly what to do with the content and how it should be displayed.

2 second reduction in request times

Unfortunately, the GraphQL API of the CMS was not very well implemented and lacked a working GQL schema. Together with the backend developers, we made sure that the schema was complete and available to the frontend.

The frontend was also sending POST requests, which are not cacheable, to the GQL API. We changed this to GET requests and added a caching layer in the backend.

After this we went ahead and enabled Automatic Persisted Queries, APQ, to make the queries smaller, cacheable and reusable. On the frontend, I extracted the query logic from the Nuxt application into a shared, fully typed utility library.

Paired with a new, site-wide GQL client that takes care of local caching and reuse of queries, this resulted in an overall 2 second reduction in request times.

A graph showing the request times before and after the GQL improvements
A graph showing the request times before and after the GQL improvements (release at the vertical lines)

My role

I was initially contracted as a Frontend Developer but got promoted to Tech Lead after a few months. I'm now responsible for the frontend team and heavily involved in the technical and architectural decisions.

Going forward

Usually I try to make a little summary of what I've done and what I've learned, but since this is my current contract I'll save that for when I'm done. We have a lot of exciting things planned and I'm looking forward to see them all come to life!

Key technologies

TypeScript
Nuxt
Nuxt modules
Vue.js
i18n
Vite
Rest
GraphQL
Elasticsearch

Selected WorksOther companies I've had the pleasure of working with