Deutsch texts not displayed properly in Chrome

I have a statically generated website with GatsbyJS. It uses react-intl for a localization but I don't think this is causing a problem.

When I open the website (it is hosted on AWS S3) for the first time it usually displays german transcription very well, but when I open developer tools and refresh the page the transcriptions are often broken (the specific German letters are not displayed properly).

Transcriptions are stored in a js file.

Steps that I use to reproduce the error:

  1. I reopen the browser and go to the website. If I see correct texts I then open the dev tools and go to Application => Frames section => Scripts dropdown and I see:

enter image description here

  1. Then I refresh the page (sometimes more than once) and somehow texts are now broken:

enter image description here

Note that this is the same static file!

  • It seems that this is only appearing in Chrome.
  • When I build and run website locally then it seems to always work (which then would suggest it's not chrome fault).

Not sure where might be the problem