14

Code :

var newurl = window.location.protocol + "//" + window.location.host + window.location.pathname +"?"+ queryStr; 
window.history.pushState({path:newurl},'',newurl)

Current scenario :

Every time when window.history.pushState() is invoked favicon requests occur rapidly.It makes network request for favicon on every call of this function.

Expected scenario :

The favicon should be loaded only once on page load, I would not expect the favicon load on every request of window.history.pushState().

Favicon paths are link like this in HTML page :

<!-- Favicon -->
  <link rel="icon" type="image/png" href="../img/icon/favicon-16x16.png" sizes="16x16">
  <link rel="icon" type="image/png" href="../img/icon/favicon-32x32.png" sizes="32x32">
  <link rel="icon" type="image/png" href="../img/icon/favicon-96x96.png" sizes="96x96">
halfer
  • 19,824
  • 17
  • 99
  • 186
Debug Diva
  • 26,058
  • 13
  • 70
  • 123

1 Answers1

9

It looks like a bug in Chromium browsers. See this open issue.

But there seems to be a workaround if you use base64 image as href the request won't occur.

<link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgo=">

See this question.

Community
  • 1
  • 1
Ankit Singh
  • 24,525
  • 11
  • 66
  • 89
  • In Chrome, when holding on the Back button, you get a list of all the links in history and you can choose one. The links have both icon and text. It only seems normal that the request for favico would be made when adding stuff to history. I wouldn't call it a bug. – Siderite Zackwehdex Mar 19 '16 at 16:28
  • Seems legit. I expressed my doubt in the answer `looks like a bug`, may not be, that's why it's open since 2012. – Ankit Singh Mar 19 '16 at 16:32
  • Thanks for the update..so there is any alternate solution for this problem.I don't want to load favicon on every call of window.history.pushState() – Debug Diva Mar 19 '16 at 17:42
  • You can convert your icons to `base64` images and put it in `href` of `favicon` link. – Ankit Singh Mar 19 '16 at 18:04
  • @A_Singh, but there is no path of favicon in your answer..something like that `image.png`. – Debug Diva Mar 19 '16 at 18:52
  • That's the trick "to not use" `image.png`, instead use `base64` image. If you don't know how to convert your image to one, see [this](https://www.base64-image.de/) website. Convert and put the output in `href` value. To read more about `base64 files` see [this](https://en.wikipedia.org/wiki/Data_URI_scheme) wikipedia page. – Ankit Singh Mar 19 '16 at 18:56
  • Thanks..its working fine :) .. but i am getting very large string after convert image to base64..something like this..`data:image/png;base64,khjsfUYFDKJkfdskkiVBORw0KGgodfvjklsfksLDLDDK......`..is there any way to shorten this encoded string – Debug Diva Mar 21 '16 at 10:35
  • This **string** is your image now, so it's gonna be large, you can't reduce the size without losing data. You can compress (`gzip` which I don't know much about) your image or reduce the resolution before encoding it into `base64`. **More quality ~ Longer String** there's no going around it. – Ankit Singh Mar 21 '16 at 10:51
  • 1
    Thanks for the help :) – Debug Diva Mar 21 '16 at 11:42