{"id":21433213,"url":"https://github.com/cdwv/navigation-timing-analytics","last_synced_at":"2025-07-14T13:30:49.357Z","repository":{"id":78214578,"uuid":"74592573","full_name":"cdwv/navigation-timing-analytics","owner":"cdwv","description":"Simple library that will help you track navigation timing API data pushing the data to InfluxDB","archived":false,"fork":false,"pushed_at":"2016-11-24T08:49:58.000Z","size":19,"stargazers_count":5,"open_issues_count":0,"forks_count":1,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-04-08T09:11:09.925Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/cdwv.png","metadata":{"files":{"readme":"Readme.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2016-11-23T16:04:17.000Z","updated_at":"2021-11-05T18:05:59.000Z","dependencies_parsed_at":"2023-03-12T03:47:30.791Z","dependency_job_id":null,"html_url":"https://github.com/cdwv/navigation-timing-analytics","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/cdwv/navigation-timing-analytics","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cdwv%2Fnavigation-timing-analytics","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cdwv%2Fnavigation-timing-analytics/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cdwv%2Fnavigation-timing-analytics/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cdwv%2Fnavigation-timing-analytics/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/cdwv","download_url":"https://codeload.github.com/cdwv/navigation-timing-analytics/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cdwv%2Fnavigation-timing-analytics/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":265297455,"owners_count":23742586,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-22T23:26:42.805Z","updated_at":"2025-07-14T13:30:49.348Z","avatar_url":"https://github.com/cdwv.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Wait a minute, what is this black magic?\n\n`navigation-timing-analytics` is a small script, that will try to take Navigation Timing API metrics (and maybe a little bit of URL and user agent) right after page load and send them to your InfluxDB. It will laverege Beacon API if possible to have little or no influence on page loading experience, but it'll work in safari too!\n\n# Usage\n\n## Via script load\n\n```html\n\u003cscript src=\"navigation-timing-analytics.min.js\" type=\"text/javascript\"\u003e\u003c/script\u003e\n\u003cscript\u003e\n    timingAnalytics('https://your-influx.com', 'influx_db','influx_username', 'influx_password', 'metrics');\n\u003c/script\u003e\n```\n\n\n## Via browserify\n\n```js\nvar timingAnalytics = require('navigation-timing-analytics');\ntimingAnalytics('https://your-influx.com', 'influx_db','influx_username', 'influx_password', 'metrics');\n```\n\n## And that is it! \nEach call to the `timingAnalytics` will place a set of metrics from Navigation Timing API\nIn your InfluxDB you'll find now metrics for your page:\n\n```\n\u003e select * from my_ultra_page\n```\n\n```json\n{\n    \"results\": [\n        {\n            \"series\": [\n                {\n                    \"name\": \"my_ultra_page\",\n                    \"columns\": [\n                        \"time\",\n                        \"connectEnd\",\n                        \"connectStart\",\n                        \"domComplete\",\n                        \"domContentLoadedEventEnd\",\n                        \"domContentLoadedEventStart\",\n                        \"domInteractive\",\n                        \"domLoading\",\n                        \"domainLookupEnd\",\n                        \"domainLookupStart\",\n                        \"fetchStart\",\n                        \"loadEventEnd\",\n                        \"loadEventStart\",\n                        \"navigationStart\",\n                        \"requestStart\",\n                        \"responseEnd\",\n                        \"responseStart\",\n                        \"url\",\n                        \"userAgent\"\n                    ],\n                    \"values\": [\n                        [\n                            1479916571000000000,\n                            1.479916571458e+12,\n                            1.479916571458e+12,\n                            1.479916571537e+12,\n                            1.479916571536e+12,\n                            1.479916571536e+12,\n                            1.479916571536e+12,\n                            1.479916571481e+12,\n                            1.479916571458e+12,\n                            1.479916571458e+12,\n                            1.479916571458e+12,\n                            1.479916571537e+12,\n                            1.479916571537e+12,\n                            1.479916571458e+12,\n                            1.479916571466e+12,\n                            1.479916571474e+12,\n                            1.479916571472e+12,\n                            \"http://myultrapage.com\",\n                            \"Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/54.0.2840.99 Safari/537.36\"\n                        ]\n                    ]\n                }\n            ]\n        }\n    ]\n}\n```\n\nGive it a try with some simple queries:\n\n```sql\n select responseEnd - navigationStart as \"Net'working\", domInteractive - domLoading as \"DOM parsing\", domContentLoadedEventStart - domInteractive as \"Parser blocking \u003cscript\u003e\", domContentLoadedEventEnd - domContentLoadedEventStart as \"ready/DOMContentLoaded event js\", loadEventStart - domInteractive as \"Images and other assets loading\",loadEventEnd - loadEventStart as \"Load event js\", loadEventEnd - navigationStart as \"Total time\" from my_ultra_page\n```\n\n# FAQ\n\n**WTF does \"right after the page load\" mean**\n\nMore or less the same as \n```js\nwindow.addEventListener('load', funciton(){ \n    setTimeout(stuff);\n})\n```\n\n**My https page does not appear in InfluxDB metric :(**\n\nBear in mind that if your page sits on `https`, then your InfluxDB api needs to be using `https` as well. Otherwise browser will block the request as unsafe. \n\n\n**Can you add XYZ feature**\n\nThis lib is fairly basic and written with one simple task in mind. If you'd like to see more features feel free to propose changes.\n\nAlso I am sure you could do it faster than me, so don't hesitate to fork, commit and create PR!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcdwv%2Fnavigation-timing-analytics","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcdwv%2Fnavigation-timing-analytics","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcdwv%2Fnavigation-timing-analytics/lists"}