npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2025 – Pkg Stats / Ryan Hefner

@newrelic/video-html5

v4.1.0

Published

New relic tracker for HTML5 players

Readme

Community Project header

New Relic Html5 Tracker Agent

The New Relic Html5 Tracker enhances your media applications by tracking video events, playback errors, and other activities, providing comprehensive insights into performance and user interactions.

  • The Html5 tracker is available as a ready-to-use JavaScript snippet for easy copy-paste integration.
  • New Relic Html5 tracker auto-detects events emitted by Html5 Player.
  • For questions and feedback on this package, please visit the Explorer's Hub, New Relic's community support forum.
  • Looking to contribute to the Player Name agent code base? See DEVELOPING.md for instructions on building and testing the browser agent library, and Contributors.

Adding The Html5 Tracker To Your Project

To integrate New Relic Tracker Agent into your web application effectively, Below is a guide on how to do this within your HTML file, if you want to with snippet code

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>New Relic Tracker Integration</title>

    <!-- snippet code generated get it from new relic onboarding steps -->
    <script src="path/to/Html5-tracker.js"></script>
  </head>
  <body>
    <!-- Your HTML content -->
  </body>
</html>

Adding the agent package to your project

To make the tracker available to your application, install via NPM or Yarn.

$ npm install @newrelic/video-html5
$ yarn add @newrelic/video-html5

Instantiating the Html5 Tracker

// Add import statement
import Html5Tracker from '@newrelic/video-html5';

// Get Application info from onboarding steps of new relic, from tiles Place a JavaScript Snippet Code
const options = {
  info: {
    beacon: 'xxxxxxxxxx',
    applicationID: 'xxxxxxx',
    licenseKey: 'xxxxxxxxxxx',
  },
};

// Add a Html5Tracker
const tracker = new Html5Tracker(videoInstance, options);

// For setting userId
tracker.setUserId('userId');

// For Sending custom Attributes
tracker.sendOptions({
  customData: {
    contentTitle: 'Override Existing Title',
    customPlayerName: 'myGreatPlayer',
    customPlayerVersion: '9.4.2',
  },
});

// For sending Custom Video Action
tracker.sendCustom('CUSTOM_ACTION', 'state time', {
  test1: 'value1',
  test2: 'value2',
});

// For setting different harvest interval (1s to 5 mins)
tracker.setHarvestInterval(40000); // setting for 40 secs

Data Model

To understand which actions and attributes are captured and emitted by the Html5 Player under different event types, see DataModel.md.

Support

New Relic hosts and moderates an online forum where customers can interact with New Relic employees as well as other customers to get help and share best practices. Like all official New Relic open source projects, there's a related Community topic in the New Relic Explorer's Hub.

We encourage you to bring your experiences and questions to the Explorer's Hub where our community members collaborate on solutions and new ideas.

Contributing

We encourage your contributions to improve New Relic Html5 Tracker! Keep in mind when you submit your pull request, you'll need to sign the CLA via the click-through using CLA-Assistant. You only have to sign the CLA one time per project. If you have any questions, or to execute our corporate CLA, required if your contribution is on behalf of a company, please drop us an email at [email protected].

A note about vulnerabilities

As noted in our security policy, New Relic is committed to the privacy and security of our customers and their data. We believe that providing coordinated disclosure by security researchers and engaging with the security community are important means to achieve our security goals.

If you believe you have found a security vulnerability in this project or any of New Relic's products or websites, we welcome and greatly appreciate you reporting it to New Relic through our bug bounty program.

License

New Relic Html5 Tracker is licensed under the Apache 2.0 License.