Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

setup lightstep open telemetry js snippet #260

Open
codecakes opened this issue May 24, 2022 · 5 comments · May be fixed by #259
Open

setup lightstep open telemetry js snippet #260

codecakes opened this issue May 24, 2022 · 5 comments · May be fixed by #259
Labels
enhancement New feature or request help wanted Extra attention is needed infra up-for-grabs

Comments

@codecakes
Copy link
Contributor

codecakes commented May 24, 2022 •
edited
Loading

UPDATED

We need a vendor-neutral open-source Observability framework for instrumenting, generating, collecting, and exporting telemetry data such as traces, metrics, logs.

The following code walkthrough is better suited for node driven service and is meant for reference.
A good browser based example is given here:

  1. Add the code during initialization of the app;
  2. Set two constants in constants.js following same semantics as others: LS_ACCESS_TOKEN and LS_SERVICE_NAME
    then setup the code like so:
const { lightstep, opentelemetry } =
      require("lightstep-opentelemetry-launcher-node");
      
// Set access token. If you prefer, set the LS_ACCESS_TOKEN environment variable instead, and remove accessToken here.
// setup LS_ACCESS_TOKEN in constants.js file;
const accessToken = LS_ACCESS_TOKEN;

const sdk = lightstep.configureOpenTelemetry({
  accessToken,
  serviceName: LS_SERVICE_NAME, // setup this name from constants.js file;
});
  1. Start the OpenTelemetry SDK. All of your application code and imports need to be inside the then() block so that they run after OpenTelemetry has been setup.
sdk.start().then(() => {
  // All of your application code and any imports that should leverage
  // OpenTelemetry automatic instrumentation must go here; e.g.,
  // const express = require('express');

  // If you're using an automatically instrumented library (such as Express,
  // as above), spans will be created automatically.  If you would like to manually
  // create a span, uncomment the lines below:
  // const tracer = opentelemetry.trace.getTracer('example');
  // const span = tracer.startSpan('test-span');
  // span.end();
  // tracer.getActiveSpanProcessor().shutdown();
});

Reference:
@codecakes codecakes added enhancement New feature or request help wanted Extra attention is needed infra labels May 24, 2022
@codecakes codecakes linked a pull request May 24, 2022 that will close this issue
Update node.js.yml #259
Open
@tim08094495757
Copy link

I have two suggestions.
a. use express to serve react-scripts build with the snippet you mentioned

  1. https://create-react-app.dev/docs/deployment/
  2. setup lightstep open telemetry js snippet #260 (comment)

b. migrate from create-react-app to next js with open telemetry

  1. https://nextjs.org/docs/migrating/from-create-react-app
  2. https://signoz.io/blog/opentelemetry-nextjs/

@codecakes
Copy link
Contributor Author

I have two suggestions.
a. use express to serve react-scripts build with the snippet you mentioned

How will be serve this as static single page cdn if we use express?

b. migrate from create-react-app to next js with open telemetry

Why? What is the motivation (in a single line) to migrate the entire codebase to next js? What is the the investment cost of it vs incentive of doing so?

@tim08094495757
Copy link

tim08094495757 commented Jul 12, 2022 •
edited
Loading

https://lightstep.com/opentelemetry/js

I don't take a deep dive into the source of lightstep-opentelemetry-launcher-node.

But if some stuffs related to require('lightstep-opentelemetry-launcher-node') can't be built as static file,
sth like express will need to be used.

or if npm install @opentelemetry/api @opentelemetry/web @opentelemetry/tracing --save
alone without express can successfully integrate this repo with opentelemetry, it would be great.

=> need time to survey

How will be serve this as static single page cdn if we use express?

can't be fully static. But cdn can also be used to cache the specific pattern of url.

What is the motivation (in a single line) to migrate the entire codebase to next js?

I think, if sth like express is needed or the project becomes more complicated, next.js may also be cool.
https://www.reddit.com/r/reactjs/comments/s3k3xt/when_is_it_recommended_to_use_next_over_react/

@codecakes
Copy link
Contributor Author

I don't take a deep dive into the source of lightstep-opentelemetry-launcher-node.

But if some stuffs related to require('lightstep-opentelemetry-launcher-node') can't be built as static file, sth like express will need to be used.

or if npm install @opentelemetry/api @opentelemetry/web @opentelemetry/tracing --save alone without express can successfully integrate this repo with opentelemetry, it would be great.

Yes ofcourse this should be the way to go: https://opentelemetry.io/docs/instrumentation/js/getting-started/browser/
You can do some research on a simple hello world tracing as an exercise.

How will be serve this as static single page cdn if we use express?

can't be fully static. But cdn can also be used to cache the specific pattern of url.

If you build it in the distribution that is served like provided in above links ☝️ , it will be static.

I think, if sth like express is needed or the project becomes more complicated, next.js may also be cool.
https://www.reddit.com/r/reactjs/comments/s3k3xt/when_is_it_recommended_to_use_next_over_react/

Changing frameworks does not automatically solve code complexity. Building with a clean design in mind solves for the complexity. We have different perspective screens in the website and they all run just fine. Just to introduce a telemetry package, changing the entire framework is an overkill.

@codecakes
Copy link
Contributor Author

@tim08094495757 I've updated the description.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
enhancement New feature or request help wanted Extra attention is needed infra up-for-grabs
Projects
mycovidconnect
Status: In Progress
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Update node.js.yml Xcov19/mycovidconnect
2 participants
@codecakes @tim08094495757