favicon not updating

[charred epoch]

when deploying my nextjs blog on github pages i updated favicon in a commit but the favicon didnt updated in the prod site

[distant kelp]

Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

[true cloud]

Please add more information to your question

Your question currently does not have sufficient information for people to be able to help. Please add more information to help us help you, for example: relevant code snippets, a reproduction repository, and/or more detailed error messages. See more info on how to ask a good question in https://discord.com/channels/752553802359505017/1138338531983491154 and #welcome message.

Requested by B33fb0n3

[charred epoch]

one sec

here is the repository link https://github.com/oyepriyansh/blog

[thick crystal]

It looks like a local caching issue. I created a reproduction of it. Thanks for sharing your project.
https://codesandbox.io/p/github/oyepriyansh/blog/main

As you can see, there is a favicon, so your code is 100% correct. However, there might be some issue locally. To clear the cache, open the dev tools, go to "Network" and checkmark "Disable cache". Now keep the dev tool open and reload your page. The favicon is now visible. If not, check inside the network tab, from where the favion was loaded and maybe even preview it there, to see if it's the correct one

[charred epoch]

in the production site oyepriyansh.github.io/blog it is showing the old favicon, i tried on multiple device after latest commit

[thick crystal]

have you tried it like I mentioned [here](#1277941566497099858 message)?

What was the result?

[charred epoch]

i tried

[thick crystal]

can you redeploy your project once and check the same again

[charred epoch]

alr, should I delete repo or just delete and rewrite the yml file?

[thick crystal]

nothing from that. Just a redeploy

[charred epoch]

ok I did
https://github.com/oyepriyansh/blog/actions/runs/10576935542

now I opened the site in my new device for the first time and still the old icon appears

[thick crystal]

now I get this favicon as well. And that's also the icon, that is in your file dir. So everything is fine now, right?

[charred epoch]

the icon in my file dirr is my pfp not this showing in the site

the icon currently showing is from old commit

[thick crystal]

I might be wrong, but is it cached by your server?

[charred epoch]

you are correct maybe

i dont have much idea

[woeful granite]

this thread reminded me of realfavicongenerator.com where they had this option at the bottom

perhaps because favicon is aggressively cached, it gets cached by github (appears like you're using github pages) and it might take a while (or even never) for it to be revalidated

ig try appending ?v=1 after favicon.ico and see if that revalidated the cache?

https://stackoverflow.com/questions/2208933/how-do-i-force-a-favicon-refresh yeah here's an SO question

[thick crystal]

There is no favicon.ico request that me actively create. It's handled by nextjs. And yes, the max-age is 31556952. So... it will either take some time or he can revalidate it himself. I thought the redeploy would invalidate the server cache... but looks like it does not.

@charred epoch invalidate your server cache

[woeful granite]

i dont think its possible to invalidate github pages' cache tho

its automatically handled by github

[charred epoch]

got it

[thick crystal]

delete it 😈

[charred epoch]

deleted

bruh

now the workflow run is queued

wtf

[thick crystal]

redeploy it

[charred epoch]

it will be queued

until precious dont succed

and i tried canceling previous one but it says requested

[thick crystal]

how long does it take?

[charred epoch]

i am cooked

[thick crystal]

oho 💀

[charred epoch]

ok it is resolved now, I just deleted the repo and pushed the code into a new repo

my bad I thought it's nextjs issue

[thick crystal]

Seems like it was a caching issue ^^
#1277941566497099858 message

After deleting the cache and redeploying the project, the correct favicon showed up.

[distant kelp]

✅ Success!

This question has been marked as answered! If you have any other questions, feel free to create another post

Jump to answer

[Click here](#1277941566497099858 message)

[tawdry oak]

I'm not sure if this is still relevant, but I was running into a similar issue. When making a new NextJS project, it puts the favicon.ico in the app folder. I tried changing the icon, but the best I got was an image with a white background (instead of transparent).

Only when I moved the favicon to a public folder, did it update as expected? Why does it have the favicon in the app folder by default if you can't leave it there?