Sentry experience and architecture, a fledgling monitoring product with a market value of $100million

Under the survey, the market value of fledgling reached 1 Billion dollars of monitoring products sentry, Because I will spend a week copying its functions .

Sentry Product experience

From error tracking to performance monitoring , Developers can see what is really important from the front end to the back end , Solve problems faster , And keep learning about their applications .

Create project

The supported types are as follows

So here I'm going to choose React project .

After creating the project, it will show React Configuration document of the client ：

Full documentation visible ：https://docs.sentry.io/platforms/javascript/guides/react/

Create a... Locally React Project to test .

Reference documents ：
https://zh-hans.reactjs.org/tutorial/tutorial.html#setup-option-2-local-development-environment

Issue： Look at problems

Wait for the event for the first time

In order to see the error report , We write an error button

Upload to sentry after , You can see the error report ：

Click in the detailed exception chain

Performance Performance features

Divided into all transactions 、web、 front end 、 Back end 、 Mobile

Performance Monitoring requires the client to start monitoring

export default Sentry.withProfiler(App);

Then you can see the access performance

Release function

Is to compare the errors caused by various versions , Find out which version introduced the problem .

Discover function

This function is a paid function , Free experience 14 God . Used to find the trend of past events , Support various filter queries .

Dashboard Instrument cluster functions

Is the general dashboard function , Configure various display chart components .

Sentry framework

https://develop.sentry.dev/architecture/

Relay： Transfer service , Be responsible for filtering events , Sends the event to Kafka.

Kafka： Event queue .

Snuba： Used to search for events , consumption Kafka Information about the event , Deposit in CK in .

Redis: High availability redis colony , Cache configuration 、 Event data .

Postgres： according to file , Performance monitoring is stored trace data , And it will be cleaned regularly .

Symbolicator： A service that assists in handling events , Handle stacktrace.

Sentry（web）： Background management interface , Server use python,django Framework development .

Complete data flow , In the complete document Move the mouse up to explain .

from SDK Principle of development

https://develop.sentry.dev/sdk/overview/

Unified use of templates

It suggests that the client use of all languages should be like the following ：

1、 Initialize server information and configuration （ Generally, it is at the beginning of service startup ）

2、 Intercept where you want to catch exceptions , Or report some data where you want to bury ;

3、 After reporting, it will return a ID, You can type it in the log for convenient inquiry .

Event interface

https://develop.sentry.dev/sdk/event-payloads/

Sentry Description of various interface fields of the event submitted by the client , That is, the data structure when reporting data .

issue Of Stack Trace Interface report

The corresponding is stacktrace.

Here is an example

{
    
    "exception": {
    
        "values": [
            {
    
                "type": "ReferenceError",
                "value": "methodDoesNotExist is not defined",
                "stacktrace": {
    
                    "frames": [
                        {
    
                            "filename": "http://localhost:3000/static/js/bundle.js",
                            "function": "MessagePort.performWorkUntilDeadline",
                            "in_app": true,
                            "lineno": 56254,
                            "colno": 25
                        },
                        {
    
                            "filename": "http://localhost:3000/static/js/bundle.js",
                            "function": "flushWork",
                            "in_app": true,
                            "lineno": 55970,
                            "colno": 18
                        }
                    ]
                },
                "mechanism": {
    
                    "type": "instrument",
                    "handled": true,
                    "data": {
    
                        "function": "addEventListener",
                        "handler": "callCallback",
                        "target": "EventTarget"
                    }
                }
            }
        ]
    },
    "level": "error",
    "event_id": "febea4ba507b43f4becce8532af35301",
    "platform": "javascript",
    "timestamp": 1655258077.609,
    "environment": "production",
    "sdk": {
    
        "integrations": [
            "InboundFilters",
            "FunctionToString",
            "TryCatch",
            "Breadcrumbs",
            "GlobalHandlers",
            "LinkedErrors",
            "Dedupe",
            "HttpContext",
            "BrowserTracing"
        ],
        "name": "sentry.javascript.react",
        "version": "7.1.1",
        "packages": [
            {
    
                "name": "npm:@sentry/react",
                "version": "7.1.1"
            }
        ]
    },
    "contexts": {
    
        "trace": {
    
            "op": "pageload",
            "span_id": "90c96f00acb84b79",
            "status": "internal_error",
            "trace_id": "d1dc3bd5f3fd437ba801d29f256685e2"
        }
    },
    "tags": {
    
        "transaction": "/"
    },
    "request": {
    
        "url": "http://localhost:3000/",
        "headers": {
    
            "Referer": "http://localhost:3000/",
            "User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/102.0.0.0 Safari/537.36"
        }
    },
    "extra": {
    
        "arguments": [
            {
    
                "type": "react-invokeguardedcallback",
                "target": "react",
                "currentTarget": "react",
                "isTrusted": false
            }
        ]
    }
}

Performance Performance interface parameters

https://develop.sentry.dev/sdk/event-payloads/span/

Corresponding Span Interface , Here is an example ：

{
    
    "contexts": {
    
        "trace": {
    
            "op": "pageload",
            "span_id": "98b78c94df7c269b",
            "tags": {
    
                "effectiveConnectionType": "4g",
                "deviceMemory": "8 GB",
                "hardwareConcurrency": "8",
                "sentry_reportAllChanges": false
            },
            "trace_id": "40c91f4ff47744d092ccc9accfdc966a"
        }
    },
    "spans": [
        {
    
            "data": {
    
                "Transfer Size": 300,
                "Encoded Body Size": 3461,
                "Decoded Body Size": 3870
            },
            "description": "/favicon.ico",
            "op": "resource.other",
            "parent_span_id": "98b78c94df7c269b",
            "span_id": "b98e6c4f5cc0d19a",
            "start_timestamp": 1655259235.3195002,
            "timestamp": 1655259235.3388002,
            "trace_id": "40c91f4ff47744d092ccc9accfdc966a"
        },
        {
    
            "data": {
    
                "Transfer Size": 300,
                "Encoded Body Size": 5347,
                "Decoded Body Size": 5347
            },
            "description": "/logo192.png",
            "op": "resource.other",
            "parent_span_id": "98b78c94df7c269b",
            "span_id": "a63b2692832e459e",
            "start_timestamp": 1655259235.3198001,
            "timestamp": 1655259235.3390002,
            "trace_id": "40c91f4ff47744d092ccc9accfdc966a"
        }
    ],
    "start_timestamp": 1655259235.0829,
    "tags": {
    
        "effectiveConnectionType": "4g",
        "deviceMemory": "8 GB",
        "hardwareConcurrency": "8",
        "sentry_reportAllChanges": false
    },
    "timestamp": 1655259235.3390002,
    "transaction": "/",
    "type": "transaction",
    "measurements": {
    
        "fp": {
    
            "value": 179.0001392364502,
            "unit": "millisecond"
        },
        "mark.fp": {
    
            "value": 1655259235.2619002,
            "unit": "second"
        },
        "fcp": {
    
            "value": 179.0001392364502,
            "unit": "millisecond"
        },
        "mark.fcp": {
    
            "value": 1655259235.2619002,
            "unit": "second"
        },
        "connection.rtt": {
    
            "value": 250,
            "unit": "millisecond"
        },
        "connection.downlink": {
    
            "value": 0.45,
            "unit": ""
        },
        "ttfb": {
    
            "value": 9.999990463256836,
            "unit": "millisecond"
        },
        "ttfb.requestTime": {
    
            "value": 2.79998779296875,
            "unit": "second"
        }
    },
    "platform": "javascript",
    "event_id": "78eb3ad4228b4ff6a50b4ec097623380",
    "environment": "production",
    "sdk": {
    
        "integrations": [
            "InboundFilters",
            "FunctionToString",
            "TryCatch",
            "Breadcrumbs",
            "GlobalHandlers",
            "LinkedErrors",
            "Dedupe",
            "HttpContext",
            "BrowserTracing"
        ],
        "name": "sentry.javascript.react",
        "version": "7.1.1",
        "packages": [
            {
    
                "name": "npm:@sentry/react",
                "version": "7.1.1"
            }
        ]
    },
    "request": {
    
        "url": "http://localhost:3000/",
        "headers": {
    
            "Referer": "http://localhost:3000/",
            "User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/102.0.0.0 Safari/537.36"
        }
    },
    "extra": {
    }
}