Synthetic Monitoring and e2e Testing: 2 Sides of the Same Coin

DevOps.js

DevOps.js Conf 2024

Carly Richmond

React Summit

I am attending the biggest #Reactjs conference remotely. You may get a limited free ticket (50% of talks, no workshops) and join me by clicking this badge.

#react #reactjs

React Summit 2023

Synthetic Monitoring and E2E Testing - 2 Sides of the Same Coin

TestJS Summit is getting back in 2023 in hybrid format with the first in-person day streamed from the Berlin venue including hybrid networking features and interactive entertainment; and second day, as well as the numerous free workshops, streamed to the global audience online.

TestJS Summit is event for QAs and software developers to get up to date with JS testing best practices, sharpen skills and get latest updates from top products core teams. Get a full ticket to participate in workshops, and network with others JS testing folks on December 7-11, 2023.

TestJS Summit

TestJS Summit 2023

Observability for React Developers

Get ready for an annual deep dive into the latest trends in React and Web development. Learn from engineers behind the framework ecosystem and early adopters at the main React Conference in the UK.The concept of the event is both about covering all you need to catch up on in the React ecosystem, combined with deep technical exploration of the latest architectural trends, new feature adoption, and efficient ways to solve complex problems.Engage in discussion rooms, hallway track with experts, hands-on practical workshops, and tens of insightful talks. Engineers of any level are welcome but be prepared for hardcore.

React Advanced

React Advanced 2024

React Day Berlin

React Day Berlin 2024

Evaluating the performance of React applications is hard! OpenTelemetry (or OTel) can provide tracing capabilities to identify bottlenecks. But when it comes to performance metrics, client instrumentation is currently under development. In this talk, I will share how to instrument a React application with OTel for tracing and how a RUM agent (in this case, Elastic's) can be used to collect page load and metrics for diagnosing slowness in production applications.

Evaluating React Application Performance with a Sip of RUM

Everywhere we look we see examples of leveraging AI technologies not just while building software, but in our web applications too. While developers want to embrace new shiny technologies, tech leaders raise concerns about the risk of exposing their data for training, alongside other accuracy issues such as source hallucination. Using vector search alongside LLMs can ground applications to a known source, and allow the generation of domain-specific responses. In this talk, I'll show how to combine Elasticsearch and Langchain in serverless applications to build a grounded RAG application and show results in a simple React UI.

Grounding AI Applications with React, JavaScript, Langchain and Elasticsearch

Observability is the ability to measure the current state of a system. Backend engineers are becoming more familiar with the 3 pillars of observability, and technologies such as OpenTelemetry that can be used to instrument applications and diagnose issues. Yet in the frontend world, we're behind the curve. Join me as I dive into the tools and techniques we can use to instrument, monitor and diagnose issues in our production React applications. I'll cover RUM agents and React framework extensions, and the metrics and traces they provide, how to combine them with backend tracing for a holistic picture, and how Synthetic Monitoring and alerting in Observability platforms can help us be alerted to issues impacting users in the UIs we build and maintain.

Despite the emergency of DevOp to unite development, support and SRE factions together using common processes, we still face cultural and tooling challenges that create the Dev and Ops silos. Specifically, we often use different tools to achieve similar testing: case in point validating the user experience in production using Synthetic Monitoring and in development using e2e testing. By joining forces around common tooling, we can use the same tool for both production monitoring and testing within CI. In this talk, I will discuss how Synthetic Monitoring and e2e Testing are two sides of the same coin. Furthermore, I shall show how production monitoring and development testing can be achieved using Playwright, GitHub Actions and Elastic Synthetics.

Despite the emergency of DevOps to unite development, support and SRE factions together using common processes, we still face cultural and tooling challenges that create the Dev and SRE silos. Specifically, we often use different tools to achieve similar testing: case in point validating the user experience in production using Synthetic Monitoring and in development using E2E testing. By joining forces around common tooling, we can use the same tool for both production monitoring and testing within CI. In this talk, I will discuss how Synthetic Monitoring and E2E Testing are two sides of the same coin. Furthermore, I shall show how production monitoring and development testing can be achieved for JavaScript-based applications using Playwright with Typescript, GitHub Actions and Elastic Synthetics.

Over the last few years, there has been a great focus on shifting tests left to earlier in the software development cycle. It's great that the emergence of trends such as e2e testing has enabled us to validate the user workflow earlier. However, they do not eliminate the need to monitor this workflow against a live production system. I have seen that the segregation of development and support teams leads to both teams using different tools to build similar automation that simply targets different environments of the same software. By joining forces, we can build automated scripts that can be used both for production monitoring and testing within CI. In this talk, I will discuss the causes of this cultural divide, and why this needs to change for us to shift user testing both left and right. Furthermore, I shall show how this can be achieved using Playwright and Elastic Synthetics and also chat through the challenges you may face shifting left and right.