From ee2dc1ee170cf477fcabfc13f72abd40b9bd0e92 Mon Sep 17 00:00:00 2001 From: Zach Pomerantz Date: Tue, 14 Mar 2023 11:39:58 -0700 Subject: [PATCH] feat: pageload performance tracing (#6146) * build: add @sentry/tracing * feat: turn on pageload tracing * feat: simple trace abstractions * fix: set sample rate in .env * fix: rm unused trace * fix: bump size for new deps * fix: unnecessary line --- package.json | 3 +- scripts/test-size.js | 2 +- src/index.tsx | 2 +- src/pages/App.tsx | 2 +- src/{integrations.ts => tracing/index.ts} | 8 +++ yarn.lock | 86 +++++++++++++---------- 6 files changed, 61 insertions(+), 42 deletions(-) rename src/{integrations.ts => tracing/index.ts} (83%) diff --git a/package.json b/package.json index b3781f692d..6b8019a771 100644 --- a/package.json +++ b/package.json @@ -132,7 +132,8 @@ "@reach/portal": "^0.10.3", "@react-hook/window-scroll": "^1.3.0", "@reduxjs/toolkit": "^1.6.1", - "@sentry/react": "^7.29.0", + "@sentry/react": "^7.40.0", + "@sentry/tracing": "^7.40.0", "@types/react-window-infinite-loader": "^1.0.6", "@uniswap/analytics": "^1.3.1", "@uniswap/analytics-events": "^2.6.0", diff --git a/scripts/test-size.js b/scripts/test-size.js index ac43ea6f3c..b8fea7ab6c 100644 --- a/scripts/test-size.js +++ b/scripts/test-size.js @@ -19,7 +19,7 @@ try { const LAST_SIZE_MAIN_KB = 374 // This is the async-loaded js, called ..js, with a matching css file. -const LAST_SIZE_ENTRY_KB = 1417 +const LAST_SIZE_ENTRY_KB = 1432 const SIZE_TOLERANCE_KB = 5 diff --git a/src/index.tsx b/src/index.tsx index 06e7756d16..3798ce825a 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,7 +1,7 @@ import '@reach/dialog/styles.css' import 'inter-ui' import 'polyfills' -import 'integrations' +import 'tracing' import { ApolloProvider } from '@apollo/client' import { FeatureFlagsProvider } from 'featureFlags' diff --git a/src/pages/App.tsx b/src/pages/App.tsx index a66757b1c4..0c35bdf8ba 100644 --- a/src/pages/App.tsx +++ b/src/pages/App.tsx @@ -6,7 +6,6 @@ import { MenuDropdown } from 'components/NavBar/MenuDropdown' import TopLevelModals from 'components/TopLevelModals' import { useFeatureFlagsIsLoaded } from 'featureFlags' import ApeModeQueryParamReader from 'hooks/useApeModeQueryParamReader' -import { STATSIG_DUMMY_KEY } from 'integrations' import { Box } from 'nft/components/Box' import { lazy, Suspense, useEffect, useMemo, useState } from 'react' import { Navigate, Route, Routes, useLocation } from 'react-router-dom' @@ -16,6 +15,7 @@ import styled from 'styled-components/macro' import { SpinnerSVG } from 'theme/components' import { flexRowNoWrap } from 'theme/styles' import { Z_INDEX } from 'theme/zIndex' +import { STATSIG_DUMMY_KEY } from 'tracing' import { getEnvName } from 'utils/env' import { getCLS, getFCP, getFID, getLCP, Metric } from 'web-vitals' diff --git a/src/integrations.ts b/src/tracing/index.ts similarity index 83% rename from src/integrations.ts rename to src/tracing/index.ts index d47c31ce93..45efdcc962 100644 --- a/src/integrations.ts +++ b/src/tracing/index.ts @@ -1,6 +1,7 @@ import 'components/analytics' import * as Sentry from '@sentry/react' +import { BrowserTracing } from '@sentry/tracing' import { initializeAnalytics, OriginApplication } from '@uniswap/analytics' import { SharedEventName } from '@uniswap/analytics-events' import { isSentryEnabled } from 'utils/env' @@ -18,6 +19,13 @@ Sentry.init({ release: process.env.REACT_APP_GIT_COMMIT_HASH, environment: getEnvName(), enabled: isSentryEnabled(), + tracesSampleRate: Number(process.env.REACT_APP_SENTRY_TRACES_SAMPLE_RATE ?? 0), + integrations: [ + new BrowserTracing({ + startTransactionOnLocationChange: false, + startTransactionOnPageLoad: true, + }), + ], /** * TODO(INFRA-143) * According to Sentry, this shouldn't be necessary, as they default to `3` when not set. diff --git a/yarn.lock b/yarn.lock index b73b25faa9..6203e1d8cc 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3630,57 +3630,67 @@ dependencies: cross-fetch "^3.1.5" -"@sentry/browser@7.29.0": - version "7.29.0" - resolved "https://registry.yarnpkg.com/@sentry/browser/-/browser-7.29.0.tgz#eb162b50adec33ac49ecd3dc930bdffbfda8098e" - integrity sha512-Af+dIcntaw405Wt7myDOMGDxiszfy4aBdshrEKYbGgcfHjgXBIdF3iKlNatvl6nrOm+IOVuKgSpCLOr2hiCwzw== +"@sentry/browser@7.42.0": + version "7.42.0" + resolved "https://registry.yarnpkg.com/@sentry/browser/-/browser-7.42.0.tgz#357731e5ab65a226c98370f9e487fe48cadab765" + integrity sha512-xTwfvrQPmYTkAvGivoJFadPLKLDS2N57D/18NA1gcrnF8NwR+I28x3I9ziVUiMCYX+6nJuqBNlMALAEPbb2G5A== dependencies: - "@sentry/core" "7.29.0" - "@sentry/replay" "7.29.0" - "@sentry/types" "7.29.0" - "@sentry/utils" "7.29.0" + "@sentry/core" "7.42.0" + "@sentry/replay" "7.42.0" + "@sentry/types" "7.42.0" + "@sentry/utils" "7.42.0" tslib "^1.9.3" -"@sentry/core@7.29.0": - version "7.29.0" - resolved "https://registry.yarnpkg.com/@sentry/core/-/core-7.29.0.tgz#bc4b54d56cf7652598d4430cf43ea97cc069f6fe" - integrity sha512-+e9aIp2ljtT4EJq3901z6TfEVEeqZd5cWzbKEuQzPn2UO6If9+Utd7kY2Y31eQYb4QnJgZfiIEz1HonuYY6zqQ== +"@sentry/core@7.42.0": + version "7.42.0" + resolved "https://registry.yarnpkg.com/@sentry/core/-/core-7.42.0.tgz#3333a1b868e8e69b6fbc8e5a9e9281be49321ac7" + integrity sha512-vNcTyoQz5kUXo5vMGDyc5BJMO0UugPvMfYMQVxqt/BuDNR30LVhY+DL2tW1DFZDvRvyn5At+H7kSTj6GFrANXQ== dependencies: - "@sentry/types" "7.29.0" - "@sentry/utils" "7.29.0" + "@sentry/types" "7.42.0" + "@sentry/utils" "7.42.0" tslib "^1.9.3" -"@sentry/react@^7.29.0": - version "7.29.0" - resolved "https://registry.yarnpkg.com/@sentry/react/-/react-7.29.0.tgz#a1c2ef522a4ccf1e948d77584e59e1254e09c92b" - integrity sha512-pJ138QTChfAiYzFrCgycBgXrAVARV6TdVvLB8z/HsqbHzPq17RhyF9M1xPE4ffeLDQAEuSudwED9CLOpJqKnAw== +"@sentry/react@^7.40.0": + version "7.42.0" + resolved "https://registry.yarnpkg.com/@sentry/react/-/react-7.42.0.tgz#7662faef398032f253fe5b174860e1ec5f76ddd5" + integrity sha512-DOGK+vuSZq5lTiqVU6wVay0AUMjtSPZu25gzLIXntfoqw36CLUswP7ew61+Tas6tpXDdf4lR3uxJRwySiQLopw== dependencies: - "@sentry/browser" "7.29.0" - "@sentry/types" "7.29.0" - "@sentry/utils" "7.29.0" + "@sentry/browser" "7.42.0" + "@sentry/types" "7.42.0" + "@sentry/utils" "7.42.0" hoist-non-react-statics "^3.3.2" tslib "^1.9.3" -"@sentry/replay@7.29.0": - version "7.29.0" - resolved "https://registry.yarnpkg.com/@sentry/replay/-/replay-7.29.0.tgz#75d5bb9df39e0a31994be245032c9998af62a304" - integrity sha512-Gw7HgviJQu6pX5RFQGVY38Av4qFn9otrZdwSSl/QK5hIyg6yhlh5h7U0ydZkrYYGiW6Z6SYYRpEWCJc/Wbh+ZQ== +"@sentry/replay@7.42.0": + version "7.42.0" + resolved "https://registry.yarnpkg.com/@sentry/replay/-/replay-7.42.0.tgz#03be2bdab35e0f2d4e415a770c23d50dba8d73b5" + integrity sha512-81HQm20hrW0+0eZ5sZf8KsSekkAlI0/u/M+9ZmOn2bHpGihqAM/O/lrXhTzaRXdpX/9NSwSCGY9k7LIRNMKaEQ== dependencies: - "@sentry/core" "7.29.0" - "@sentry/types" "7.29.0" - "@sentry/utils" "7.29.0" + "@sentry/core" "7.42.0" + "@sentry/types" "7.42.0" + "@sentry/utils" "7.42.0" -"@sentry/types@7.29.0": - version "7.29.0" - resolved "https://registry.yarnpkg.com/@sentry/types/-/types-7.29.0.tgz#ed829b6014ee19049035fec6af2b4fea44ff28b8" - integrity sha512-DmoEpoqHPty3VxqubS/5gxarwebHRlcBd/yuno+PS3xy++/i9YPjOWLZhU2jYs1cW68M9R6CcCOiC9f2ckJjdw== - -"@sentry/utils@7.29.0": - version "7.29.0" - resolved "https://registry.yarnpkg.com/@sentry/utils/-/utils-7.29.0.tgz#cbf8f87dd851b0fdc7870db9c68014c321c3bab8" - integrity sha512-ICcBwTiBGK8NQA8H2BJo0JcMN6yCeKLqNKNMVampRgS6wSfSk1edvcTdhRkW3bSktIGrIPZrKskBHyMwDGF2XQ== +"@sentry/tracing@^7.40.0": + version "7.42.0" + resolved "https://registry.yarnpkg.com/@sentry/tracing/-/tracing-7.42.0.tgz#bcdac21e1cb5f786465e6252625bd4bf0736e631" + integrity sha512-0veGu3Ntweuj1pwWrJIFHmVdow4yufCreGIhsNDyrclwOjaTY3uI8iA6N62+hhtxOvqv+xueB98K1DvT5liPCQ== dependencies: - "@sentry/types" "7.29.0" + "@sentry/core" "7.42.0" + "@sentry/types" "7.42.0" + "@sentry/utils" "7.42.0" + tslib "^1.9.3" + +"@sentry/types@7.42.0": + version "7.42.0" + resolved "https://registry.yarnpkg.com/@sentry/types/-/types-7.42.0.tgz#e5019cd41a8c4a98c296e2ff28d6adab4b2eb14e" + integrity sha512-Ga0xaBIR/peuXQ88hI9a5TNY3GLNoH8jpsgPaAjAtRHkLsTx0y3AR+PrD7pUysza9QjvG+Qux01DRvLgaNKOHA== + +"@sentry/utils@7.42.0": + version "7.42.0" + resolved "https://registry.yarnpkg.com/@sentry/utils/-/utils-7.42.0.tgz#fcffd0404836cb56975fbef9e889a42cc55de596" + integrity sha512-cBiDZVipC+is+IVgsTQLJyZWUZQxlLZ9GarNT+XZOZ5BFh0acFtz88hO6+S7vGmhcx2aCvsdC9yb2Yf+BphK6Q== + dependencies: + "@sentry/types" "7.42.0" tslib "^1.9.3" "@sinonjs/commons@^1.7.0":