Polyfills and browser compatibility (Affecting SEO)

[arunoda]

Description

I had issues getting getstorybook.io listed on Google, because it doesn't render anything on Google's Fetch and Render feature.

I so I dig into the issue and it was Array.find() couldn't find on Google's browser env. Since Google's Fetch and Render didn't provide console.log output I had to debug this for more than 4 hours doing a lot of trial and error stuff.

Why?

This is happening because we don't use babel-polyfill or any other polyfill or shims.

What we can do?

I can understand the reason behind not using polyfills. But we should document clearly on why we do it and how to add some polyfills.

I simply added following line to src/index.js and everything works fine.

import from 'airbnb-js-shims';

[thangngoc89]

I use Polyfill CDN for this https://polyfill.io/v2/docs/

It's fast and easy.

[itsdouges]

Hey! This worked great, you're my hero :-).

[gaearon]

We have docs both on supported browsers and polyfills so I feel this is good to go.

[rayshan]

@arunoda thanks I tried airbnb-js-shims and it fixed both IE 11 and SEO issues. Payload cost is quite high though.

@thangngoc89 tried polyfill.io v2, did not work for me.

[thangngoc89]

@rayshan I really hate it when people say "did not work for me". What do you mean by it's not working? what when wrong, ...