---
title: "Frontend Observability in Vue Apps with OpenTelemetry | VueDigest"
description: "This article discusses the importance of frontend observability in Vue applications, emphasizing how traditional monitoring falls short in diagnosing performance issues. It introduces OpenTelemetry as a solution for collecting telemetry data, providing insights into application behavior and performance. The article also includes a guide on setting up OpenTelemetry in Vue apps to enhance observability."
canonical_url: "https://vuedigest.com/news/frontend-observability-in-vue-apps-with-opentelemetry"
last_updated: "2026-06-10T14:35:13.766Z"
meta:
  "og:description": "This article discusses the importance of frontend observability in Vue applications, emphasizing how traditional monitoring falls short in diagnosing performance issues. It introduces OpenTelemetry as a solution for collecting telemetry data, providing insights into application behavior and performance. The article also includes a guide on setting up OpenTelemetry in Vue apps to enhance observability."
  "og:image": "https://vuedigest.com/_og/d/c_Template.takumi%2Cdescription_~VGhpcyBhcnRpY2xlIGRpc2N1c3NlcyB0aGUgaW1wb3J0YW5jZSBvZiBmcm9udGVuZCBvYnNlcnZhYmlsaXR5IGluIFZ1ZSBhcHBsaWNhdGlvbnMsIGVtcGhhc2l6aW5nIGhvdyB0cmFkaXRpb25hbCBtb25pdG9yaW5nIGZhbGxzIHNob3J0IGluIGRpYWdub3NpbmcgcGVyZm9ybWFuY2UgaXNzdWVzLiBJdCBpbnRyb2R1Y2VzIE9wZW5UZWxlbWV0cnkgYXMgYSBzb2x1dGlvbiBmb3IgY29sbGVjdGluZyB0ZWxlbWV0cnkgZGF0YSwgcHJvdmlkaW5nIGluc2lnaHRzIGludG8gYXBwbGljYXRpb24gYmVoYXZpb3IgYW5kIHBlcmZvcm1hbmNlLiBUaGUgYXJ0aWNsZSBhbHNvIGluY2x1ZGVzIGEgZ3VpZGUgb24gc2V0dGluZyB1cCBPcGVuVGVsZW1ldHJ5IGluIFZ1ZSBhcHBzIHRvIGVuaGFuY2Ugb2JzZXJ2YWJpbGl0eS4%2Ctitle_Frontend%2BObservability%2Bin%2BVue%2BApps%2Bwith%2BOpenTelemetry%2Cp_Ii9uZXdzL2Zyb250ZW5kLW9ic2VydmFiaWxpdHktaW4tdnVlLWFwcHMtd2l0aC1vcGVudGVsZW1ldHJ5Ig%2Cs_1H7V4V_cbPwTsLyp.png"
  "og:image:height": "600"
  "og:image:type": image/png
  "og:image:width": "1200"
  "og:title": "Frontend Observability in Vue Apps with OpenTelemetry"
  "twitter:description": "This article discusses the importance of frontend observability in Vue applications, emphasizing how traditional monitoring falls short in diagnosing performance issues. It introduces OpenTelemetry as a solution for collecting telemetry data, providing insights into application behavior and performance. The article also includes a guide on setting up OpenTelemetry in Vue apps to enhance observability."
  "twitter:image": "https://vuedigest.com/_og/d/c_Template.takumi%2Cdescription_~VGhpcyBhcnRpY2xlIGRpc2N1c3NlcyB0aGUgaW1wb3J0YW5jZSBvZiBmcm9udGVuZCBvYnNlcnZhYmlsaXR5IGluIFZ1ZSBhcHBsaWNhdGlvbnMsIGVtcGhhc2l6aW5nIGhvdyB0cmFkaXRpb25hbCBtb25pdG9yaW5nIGZhbGxzIHNob3J0IGluIGRpYWdub3NpbmcgcGVyZm9ybWFuY2UgaXNzdWVzLiBJdCBpbnRyb2R1Y2VzIE9wZW5UZWxlbWV0cnkgYXMgYSBzb2x1dGlvbiBmb3IgY29sbGVjdGluZyB0ZWxlbWV0cnkgZGF0YSwgcHJvdmlkaW5nIGluc2lnaHRzIGludG8gYXBwbGljYXRpb24gYmVoYXZpb3IgYW5kIHBlcmZvcm1hbmNlLiBUaGUgYXJ0aWNsZSBhbHNvIGluY2x1ZGVzIGEgZ3VpZGUgb24gc2V0dGluZyB1cCBPcGVuVGVsZW1ldHJ5IGluIFZ1ZSBhcHBzIHRvIGVuaGFuY2Ugb2JzZXJ2YWJpbGl0eS4%2Ctitle_Frontend%2BObservability%2Bin%2BVue%2BApps%2Bwith%2BOpenTelemetry%2Cp_Ii9uZXdzL2Zyb250ZW5kLW9ic2VydmFiaWxpdHktaW4tdnVlLWFwcHMtd2l0aC1vcGVudGVsZW1ldHJ5Ig%2Cs_1H7V4V_cbPwTsLyp.png"
  "twitter:title": "Frontend Observability in Vue Apps with OpenTelemetry"
---

> Index of every page on this site: [llms.txt](https://vuedigest.com/llms.txt)

Jakub Andrzejewski [ View all from this source](https://vuedigest.com/sources/jakub-andrzejewski) June 08, 2026 57

# **Frontend Observability in Vue Apps with OpenTelemetry**

[Read Original](https://dev.to/jacobandrewsky/frontend-observability-in-vue-apps-with-opentelemetry-3fb0)

Share [Share on X](https://x.com/intent/tweet?text=Frontend+Observability+in+Vue+Apps+with+OpenTelemetry&url=https%3A%2F%2Fvuedigest.com%2Fnews%2Ffrontend-observability-in-vue-apps-with-opentelemetry)

**Topics **

[vue](https://vuedigest.com/topics/vue) [performance](https://vuedigest.com/topics/performance) [opentelemetry](https://vuedigest.com/topics/opentelemetry) [observability](https://vuedigest.com/topics/observability) [ All topics →](https://vuedigest.com/topics)

![Frontend Observability in Vue Apps with OpenTelemetry](https://media2.dev.to/dynamic/image/width=1200,height=627,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fiajryi395e201bloufp6.png)

**Key takeaways**

This article discusses the importance of frontend observability in Vue applications, emphasizing how traditional monitoring falls short in diagnosing performance issues. It introduces OpenTelemetry as a solution for collecting telemetry data, providing insights into application behavior and performance. The article also includes a guide on setting up OpenTelemetry in Vue apps to enhance observability.

## **Related Articles **

![What is props reactivity loss in Vue and how to avoid it?](https://media2.dev.to/dynamic/image/width=1200,height=627,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F0wqnnm50zwbr0yhceksg.png)

Oct 26, 2026

## **What is props reactivity loss in Vue and how to avoid it?**

**Jakub Andrzejewski**

![Goodbye vue-tsc? Moving a Vue Project to TypeScript 7.1 Content Mappers](https://alexop.dev/posts/goodbye-vue-tsc-moving-a-vue-project-to-type-script-7-1-content-mappers/index.png)

Oct 24, 2026

## **Goodbye vue-tsc? Moving a Vue Project to TypeScript 7.1 Content Mappers**

**alexop.dev**

![Hexagonal Architecture in Vue: Where to Put Your Code and Why](https://mokkapps.twic.pics/vuedigest.com/article-placeholder.png)

Sep 30, 2026

## **Hexagonal Architecture in Vue: Where to Put Your Code and Why**

**alexop.dev**

```json
{"@context":"https://schema.org","@graph":[{"@id":"https://vuedigest.com/#website","@type":"WebSite","description":"Your daily dose of Vue.js and Nuxt news. Curated articles, tutorials, and updates from the Vue ecosystem.","inLanguage":"en","name":"VueDigest","url":"https://vuedigest.com","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://vuedigest.com/news?search={search_term_string}"},"query-input":"required name=search_term_string"}],"publisher":{"@id":"https://vuedigest.com/#identity"}},{"@id":"https://vuedigest.com/news/frontend-observability-in-vue-apps-with-opentelemetry#webpage","@type":"WebPage","dateModified":"2026-06-10T14:35:13.766Z","datePublished":"2026-06-08T08:59:35.000Z","description":"This article discusses the importance of frontend observability in Vue applications, emphasizing how traditional monitoring falls short in diagnosing performance issues. It introduces OpenTelemetry as a solution for collecting telemetry data, providing insights into application behavior and performance. The article also includes a guide on setting up OpenTelemetry in Vue apps to enhance observability.","name":"Frontend Observability in Vue Apps with OpenTelemetry","url":"https://vuedigest.com/news/frontend-observability-in-vue-apps-with-opentelemetry","breadcrumb":{"@id":"https://vuedigest.com/news/frontend-observability-in-vue-apps-with-opentelemetry#breadcrumb"},"isPartOf":{"@id":"https://vuedigest.com/#website"},"potentialAction":[{"@type":"ReadAction","target":["https://vuedigest.com/news/frontend-observability-in-vue-apps-with-opentelemetry"]}],"primaryImageOfPage":{"@id":"https://vuedigest.com/#logo"}},{"@id":"https://vuedigest.com/#identity","@type":"Organization","name":"VueDigest","url":"https://vuedigest.com","logo":{"@id":"https://vuedigest.com/#logo"}},{"@id":"https://vuedigest.com/news/frontend-observability-in-vue-apps-with-opentelemetry#article","dateModified":"2026-06-10T14:35:13.766Z","datePublished":"2026-06-08T08:59:35.000Z","description":"This article discusses the importance of frontend observability in Vue applications, emphasizing how traditional monitoring falls short in diagnosing performance issues. It introduces OpenTelemetry as a solution for collecting telemetry data, providing insights into application behavior and performance. The article also includes a guide on setting up OpenTelemetry in Vue apps to enhance observability.","headline":"Frontend Observability in Vue Apps with OpenTelemetry","inLanguage":"en","thumbnailUrl":"https://media2.dev.to/dynamic/image/width=1200,height=627,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fiajryi395e201bloufp6.png","@type":["Article","NewsArticle"],"author":{"@id":"https://vuedigest.com/#identity"},"image":["https://media2.dev.to/dynamic/image/width=1200,height=627,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fiajryi395e201bloufp6.png"],"isPartOf":{"@id":"https://vuedigest.com/news/frontend-observability-in-vue-apps-with-opentelemetry#webpage"},"keywords":["vue","performance","opentelemetry","observability"],"mainEntityOfPage":{"@id":"https://vuedigest.com/news/frontend-observability-in-vue-apps-with-opentelemetry#webpage"},"publisher":{"@id":"https://vuedigest.com/#identity"}},{"@id":"https://vuedigest.com/news/frontend-observability-in-vue-apps-with-opentelemetry#breadcrumb","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","item":"https://vuedigest.com/news","name":"Articles","position":1},{"@type":"ListItem","name":"Frontend Observability in Vue Apps with OpenTelemetry","position":2}]},{"@id":"https://vuedigest.com/#logo","@type":"ImageObject","caption":"VueDigest","contentUrl":"https://mokkapps.twic.pics/vuedigest.com/logo.png","inLanguage":"en","url":"https://mokkapps.twic.pics/vuedigest.com/logo.png"}]}
```

## Sitemap

See the full [sitemap](https://vuedigest.com/sitemap.md) for all pages.