Unclear that the JavaScript loader does not support User Feedback

[whitep4nth3r]

SDK

Android SDK

Description

I'm using the JavaScript loader on my website.

Whenever I'm browsing the top-level docs of JavaScript, I am expecting the instructions to apply to the loader.

On this page regarding User Feedback, there are instructions for both the SDKs and the "CDN bundle". Given I am using the loader, imported via a script tag, I assumed I was using the CDN bundle, especially since the src URL for the loader contains the string cdn.

I made a lot of notes on the information architecture of the docs regarding the JavaScript SDKs and loader, which I am going to dump here.

Related issue: #11705

Current state:

• The documentation for the “JavaScript loader” lives under the top-level heading of JavaScript: https://docs.sentry.io/platforms/javascript/)](https://docs.sentry.io/platforms/javascript/
• JavaScript-based frameworks and libraries (such as Next.js, Vue, React) are nested under “JavaScript”.
  • Whilst you can definitely use the JavaScript loader for any front-end project, it is recommended to use the official framework/library SDKs.
• Sometimes, it is unclear that the “JavaScript” top-level documentation references the vanilla JavaScript SDK usage. It becomes more clear when looking at the code samples that reference using the loader script with <script> tags.
  • Granted, there is a callout at the top of the JavaScript top-level page, but developers will often miss this by trying to find the code they need to solve their problem as quickly as possible

Suggested Solution

Suggestions:

• Nest the “JavaScript” (loader/vanilla SDK) under “browser”.
  • This introduces one more click for the developer needing these docs, but makes what developers are looking at clearer.
• On the base “JavaScript” route, display all available SDKs, similar to how the SDK selection is made on the docs home page

Problems this may cause:

• Other languages are set up in the same way as JavaScript, such as Ruby (i.e. the top-level page for Ruby shows instructions for setting up the SDK for raw Ruby, and has a callout for if you’re using a Ruby framework) — this makes sense for Ruby
  • Note that PHP does not have this callout, despite Sentry providing SDKs for specific frameworks (why is this?)
• Rearchitecting the information for JavaScript introduces an inconsistency in how information is presented across different SDKs
  • HOWEVER, JavaScript is an outlier given that developers are building both server and client applications with this language.

Secondary suggestion based on both of the above:

• Decide on a consistent information architecture based on the JavaScript server + client problem OR
• Make it very obvious that JavaScript is different because it is an outlier in how the language is used

[getsantry]

Auto-routing to @getsentry/product-owners-issues for triage ⏲️

[whitep4nth3r]

For reference, this is how we got it working for the loader:

Add this inside window.sentryOnLoad:

async function loadFeedback() {
  const feedbackIntegration = await Sentry.lazyLoadIntegration("feedbackIntegration");
  Sentry.addIntegration(feedbackIntegration());
}

loadFeedback();