Detect JS Framework used in a Website

detect-js-framework.js

// Paste these lines into website's console (Win/Linux: Ctrl + Shift + I / Mac: Cmd + Alt + I)

if(!!window.React ||
   !!document.querySelector('[data-reactroot], [data-reactid]') ||
   Array.from(document.querySelectorAll('*')).some(e => e._reactRootContainer !== undefined || Object.keys(e).some(k => k.startsWith('__reactContainer')))
)
  console.log('React.js');

if(!!document.querySelector('script[id=__NEXT_DATA__]'))
  console.log('Next.js');

if(!!document.querySelector('[id=___gatsby]'))
  console.log('Gatsby.js');

if(!!window.angular ||
   !!document.querySelector('.ng-binding, [ng-app], [data-ng-app], [ng-controller], [data-ng-controller], [ng-repeat], [data-ng-repeat]') ||
   !!document.querySelector('script[src*="angular.js"], script[src*="angular.min.js"]')
)
  console.log('Angular.js');

if (!!window.getAllAngularRootElements || !!window.ng?.coreTokens?.NgZone)
  console.log('Angular');

if(!!window.Backbone) console.log('Backbone.js');
if(!!window.Ember) console.log('Ember.js');
if(!!window.Vue) console.log('Vue.js');
if(!!window.Meteor) console.log('Meteor.js');
if(!!window.Zepto) console.log('Zepto.js');
if(!!window.jQuery) console.log('jQuery.js');

sonarqube -> React

https://www.tripadvisor.com/ -> React
https://www.thefork.be/ -> React and Next

FlanxQuikkerJS Detection!

This code detects if the website had implemented my own JS Framework FQJS

if(!!window.document.querySelector("script[src*='fq.js']") || !!window.document.querySelector("#fq-root")) 
console.log("fq.js");

github.com => react for example the repository page https://github.com/facebook/docusaurus/blob/main/README.md

https://www.primevideo.com => react

hmm... I am getting undefined..

Only This is working for me..

if(Array.from(document.querySelectorAll('*'))
.some(e => e._reactRootContainer !== undefined))
console.log('React.js');

Thanks for the code. I have been testing with some major sites like FB, AMZ and even Github and they are returning "undefined". Am I doing it wrong or these major companies have a way to cover the detection script from running? Thanks.

you could also try to use js-framework-detector which does the same thing but supports more libraries. Reference code

you could also try to use js-framework-detector which does the same thing but supports more libraries. Reference code

Thanks.

Thanks @Shubham-Kumar-2000, updated it.

Also some new react versions, have property like __reactContainer<random> instead of just _reactRootContainer.
Updated them as well for newer react 👍

With the new react update,

https://www.apple.com/store => React.js
https://open.spotify.com/ => React.js
https://react.dev/ => React.js, Next.js
https://www.gatsbyjs.com/ => React.js, Gatsby.js
https://developer.mozilla.org/en-US/ => React.js
https://www.facebook.com/ => React.js
https://www.flipkart.com/ => React.js

https://www.intercom.com/ => React.js, Next.js
https://goldenpi.com/ => Angular

web.whatsapp.com => React.js

The detection method of Vue is not working on this site:
https://www.bilibili.com/

The detection method of Vue is not working on this site: https://www.bilibili.com/

if(!!window.__VUE__) console.log('Vue.js');

I just tried this method. It's workable.

// Svelte.js detection

if(!!document.querySelector('[data-svelte-h]') || !!document.querySelector('sveltekit-endpoint, sveltekit-app'))
  console.log('Svelte.js/SvelteKit');