Best strategy for browser / feature detection with Polymer?

[Kelly St. John]

I am in the final stages of building a polymer site/app, but would like to introduce a non-polymer-based splash page to briefly describe the site/app and inform visitors that the site is only compatible with a specific list of devices/evergreen browsers, and encourage them to upgrade if needed.  I could use browser detection to warn only those visitors that are using an incompatible browser/device, or I could present the message to all visitors regardless of which browser/device they are using.  I understand that browser detection has some challenges, and that some people recommend feature detection.  Is there a best practice or any recommended strategies I could or should use to accomplish this goal for a polymer site?

Thanks!    

[Kelly St. John]

I just spotted this:  https://github.com/webcomponents/webcomponentsjs/issues/26  (https://github.com/uqlibrary/uqlibrary-home/commit/7d97c86b03223653419434d24987f69afe0e3662)

Any comments on this approach, or anything better out there?

[Rob Dodson]

Hey Kelly, you can feature detect the existence of the various web components standards client side using a javascript snippet. I covered it during part of my talk at Chrome Dev Summit: https://www.youtube.com/watch?v=kV0hgdMpH28&feature=youtu.be&t=20m3s

Basically it checks to see if the all the web component technologies are supported and if not, it loads webcomponents.js. But you could do more in that handler like display a message. Another thing to keep in mind is that Web Components are not polyfillable on really old browsers like IE 8 and the old stock Android browser. So if you have a high percentage of users coming from those browsers (and you should be able to check that with Google Analytics) then you could consider trying to detect that server side and send down a different page. That's what GitHub does

Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups "Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to polymer-dev...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/205d487a-73de-4d06-aa9e-950bbf402289%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

[Kelly St. John]

Thanks for tips Rob!  I see the snippet at the 21 minute mark of the Chrome Dev Summit presentation.  I'll try it out!

Kelly