Wappalyzer: Preact Support?

Created on 4 Apr 2017 · 12Comments · Source: AliasIO/wappalyzer

Would it be possible to add the Preact library? When using React and then aliasing it to Preact using Preact-compat to convert it, the react icon stops showing up.

Thanks!

Source

Chrischuck

Most helpful comment

function isPreact() {
  var all = document.querySelectorAll('*');
  for (let i=all.length; i--; ) {
    if (typeof Symbol!=='undefined' && all[i][Symbol.for('preactattr')] || all[i].__preactattr_) {
      return true;
    }
  }
  return false;
}

You can test it out on preactjs.com or webpack.js.org.

Alternatively, here's one that checks for _component - technically this would produce a false negative for sites built without components, but that should be few/no sites:

function isPreact() {
  return [].some.call(document.querySelectorAll('*'), node => node._component);
}

developit on 9 Apr 2017

👍3 👎1

All 12 comments

Be our guest and do a pull-request, it's not that hard :)

jvoisin on 6 Apr 2017

amilajack on 8 Apr 2017

I don't think it will be easy to detect this one. I'll compare with React which can be detected by

script pattern: As Preact is so small it's very likely it's bundled when used. Otherwise you're kind of defying the purpose of Preact no?
React global: When you bundle with Webpack you don't have those globals anymore.
data-react attribute in html: Preact doesn't use an attribute like this for it's root element.

Correct me if I'm wrong here as I have only briefly tested Preact. Btw, you're not using React anymore if your aliasing it to Preact-compat. So React should not show up on an app that uses preact/preact-compat.

wardoost on 9 Apr 2017

@developit

amilajack on 9 Apr 2017

function isPreact() {
  var all = document.querySelectorAll('*');
  for (let i=all.length; i--; ) {
    if (typeof Symbol!=='undefined' && all[i][Symbol.for('preactattr')] || all[i].__preactattr_) {
      return true;
    }
  }
  return false;
}

You can test it out on preactjs.com or webpack.js.org.

Alternatively, here's one that checks for _component - technically this would produce a false negative for sites built without components, but that should be few/no sites:

function isPreact() {
  return [].some.call(document.querySelectorAll('*'), node => node._component);
}

developit on 9 Apr 2017

👍3 👎1

You can't run arbitrary JavaScript on webpages with Wappalyzer.

AliasIO on 9 Apr 2017

@AliasIO Do you think this would be too heavy to run if a lot of entries would do this or is it technically not feasible for another reason?

wardoost on 10 Apr 2017

do you guys scan source files? if so __preactattr_ is a pretty good key.

developit on 10 Apr 2017

According to the specification not. I think we should look for a way to scan JS and source files, especially with the popularity of bundlers. The extensions would definitely need to use a web worker then as requested in #362.

wardoost on 11 Apr 2017

Wappalyzer only deals with the main page request, I wouldn't want to run the regular expressions over every file.

AliasIO on 14 Apr 2017

👍1

I think this issue can be closed then as there is no alternative way to detect Preact. Or would you leave it open in case someone finds another solution in the future?

wardoost on 17 Apr 2017

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.