Jump to content

A little guidance with this issue please? (fonts/text/animation)


Recommended Posts

I have two servers, both are nginx. On the first one I host a PixiJS game and it is showing all the texts and animations without a problem. On the second one I host the same PixiJS game but I have a problem with texts/animations at certain places. I cannot post any parts of the code because it is heavily obfuscated, but I need to know if someone faced such an issue, please.

Things I have checked/done:

  1. Checked nginx cache (there is none, it's disabled)
  2. Other caches like cloudflare etc do not exist at all (none of two servers is proxied through cloudflare)
  3. Browser cache (deleted the cache multiple times, changed browser, used incognito etc)
  4. Checked the fonts are accessible and are loaded (network tab shows they're loaded)
  5. Checked mime-types of fonts in server's response (they match)
  6. Checked for console errors or other than 200 response codes in network tab (none)
  7. Tried to pre-load the required fonts in the <head> of my page (no difference at all)
  8. Checked for any errors in the webserver's error log file (none)
  9. Disabled / deleted all the browser's extensions (no difference)
  10. Tried to completely delete and re-create the resource files from the beginning (no difference)
  11. Checked the file permissions of the resources including the font files (no difference)
  12. I even prayed for it to work, with -of course- no difference

I am uploading two screenshots, one from the server the game goes well, and one from the server I have the issues with the text/font/animation/whateveritis...

If anyone could guide me through the debugging of such a case, I'll buy him a large cold beer. Really. I am dissapointed.





Edited by analyser
Link to comment
Share on other sites

1 hour ago, ivan.popelyshev said:

Maybe compare what pixijs does with known livbs like https://fontfaceobserver.com/ ? 

here's how pixi-v7 does it https://github.com/pixijs/pixijs/blob/dev/packages/assets/src/loader/parsers/loadWebFont.ts

More info you can find by pestering people in pixijs discord :)

Thanks @ivan.popelyshev, I forgot to mention that the fonts that are being loaded are in a .fnt format. Just mentioning it in case someone remembers any known issue or something. The fact that from the first server is ok but not from the second server, makes me scratch my head since January...

Link to comment
Share on other sites

The whole atlas has many size-versions. The one I am trying to work with is the 1280x720 (for the whole atlas). I tried to work with other resolutions/sizes with the same negative result. I ensist that this is so strange that it should be something that produces the problem on the server side (nginx, or something like that). And that's because I used to use the exact same project on other servers without a problem...

@ivan.popelyshevcan you perhaps think of any server-side related problems, other than caching? (I tripple cheked all possible caches, either server side or client side, they're all disabled)

Link to comment
Share on other sites

13 minutes ago, ivan.popelyshev said:

Wait, that might probably be cross-origin issue, because it exists for all non-image types. Any warnings in console or "network" tab of chrome about wrong fetches because of CORS?  You should do Cross-Origin Ritual Sacrifice

Nope! No CORS errors anywhere. Neither in the console or the network tab!!! I can see all of the resources loaded as expected..

Link to comment
Share on other sites

1 hour ago, ivan.popelyshev said:

No idea :(

I really am willing to pay anyone who will suggest ANY solution to this freaking issue... If you are (or ANYBODY else is) interested in solving the riddle, let me know. I'm dead serious... and tired of it as well.

My budget is $100,- ... just saying.

Link to comment
Share on other sites

Have you tried replacing it with another bitmap font to see if the new one is visible?

Do you have acces to the source code? you can try to put a breakpoint when the font loads and when it is used.

You can also install the pixi dev tools extension and check if the font object is there

Change the browser to see if another one gives an error? I had this issue once with a bitmap font that was wrongly formatted in which on firefox it would crash but on chrome it would work with only some of the characters.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...