High memory consumption on website

Hey everyone,

I noticed my site consumes a large amount of memory:

.
At times, I’ve seen it go up to 1.4 GB!

Is there anything I can do to help reduce the memory consumption? I’m aware that some browsers consume more memory than others but I’m looking at this from a site building perspective. I.e, have I used bad code or bad practice, can I reduce the memory consumption through the js files themselves.

Any advice would be helpful.
Thanks,

Pokemon Empire Team

Website: https://pokemon-empire-pbs.infinityfreeapp.com/Test/?i=3#

1 Like

It looks like it fluctuates between 750-800 megabytes on my end using Opera GX, though that still isn’t ideal. The biggest contributor to RAM usage is going to be the high amount of Javascript code that page seems to be using. You may want to look into optimizing your code as much as possible, and try to only have the browser only use the Javascript that’s necessary at any given time. There isn’t a good one-size-fits-all answer to this, though minifying your code may be a good idea. However, I think a good first step is to try and analyze the code on that page to figure out where the high RAM usage is coming from so you know what to take care of.

4 Likes

The Developer Tools in your browser has a Memory tab. I have never really used it, but I would guess you could use it to analyze how exactly that memory is being used?

5 Likes

Thanks for the quick response and the suggestion. I’ve tried using the developer tools to take a deeper look at the memory tab. But in all honesty, not much of it makes a lot of sense to me.
Web development is still quite new to me so if there are any learning resources that you can recommend or spot any obvious javascript bad practices I’m doing then please let me know.

Hi,

Just got a notification that my account was suspended for reaching the maximum daily hit allowance.
I’m confused about this for several reasons:

  1. My website isn’t live yet and therefore not expecting any traffic from viewers.
  2. When I was using it to develop + test, the most it would reach is 7% of the allocated hits.
  3. I’ve adopted as many daily hit prevention mechanics such as lazy loading + combining .ks files together to avoid this from happening. Those techniques have helped so that’s why Im confused that this has happened. Seems very out of the norm.

I suspect that a bot or something has spiked the hits. Could someone take a deep dive into this please?

Account Username: epiz_31705444
Website: https://pokemon-empire-pbs.infinityfreeapp.com/Test/?i=1

Cheers,
PEmpire team

1 Like

I saw that my daily hit ticket has been combined into this one. Is that because both tickets are referring to the same account / website?

I understood daily hits and RAM consumption to be entirely separate from each other. The first looks at how much traffic / viewers your site receives. The latter is the RAM consumption the website uses. Or have I missed something?

If you are really sure no one is visiting your website, it could be that your website is receiving bot traffic, there is a loop in your code, or you are fetching too many assets from the server (causing one hit for each). or, you might be visiting your own site too much.

If your site is under development, I recommend first testing and developing your website on your local machine, then uploading the changed files to InfinityFree for production. This way, your account won’t get suspended due to a loop bug or your own mistake.

The hit counter in the control panel is not live, it updates every 6 hours. Therefore it could be higher at that time while the control panel was only showing 7%

3 Likes

In regards to the logic used to fetch assets + displaying the webpage, nothing has changed. I was only making edits to the css page yesterday and incrementing the version of the style.css file after each modification. I was also trying to debug the memory consumption issue I reported earlier using the network tools.

So I’m 99.9% sure that nothing I’ve done has caused the hits to max (the 0.1% is still possible but highly unlikely). If the site is receiving bot traffic, is it possible if someone could lift the temporary suspension? I can’t even download the files I was using and work offline.

No, it’s not possible to lift the temporary suspension before the time ends.

Also, please make sure you always have a local backup of your files, never use the file manager to edit files. If the servers crash or there is data corruption, you’ll loose your files forever with no chance of recovery.

4 Likes

In order to remove the memory consumption on a site, I always prefer to optimize the JavaScript files by minifying them and removing any unused code. It depends on the CMS, we are using. Like certain plugins in the WordPress are giving these features with ease.

Plus, I always prefer lazy loading images and asynchronous loading of non-essential scripts which help me in reducing the initial page load time.

Moreover certain caching practices are also helpful in this case.

Can you specifically explain the problem that what type of site you have ?

I have recently worked with one the tech based platform where indexation of pages, was the main issues, along with the speed as well. I fixed them nicely. So ready to help you if you need.

Thanks for the response!
On the first point:

It’s quite disheartening to hear that temp suspensions can’t be lifted. Especially suspensions that are a result of a probable bot / DDOS attack. I understand, InfinityFree servers use their own security so if something like a bot attack was to slip between the cracks and spike a user’s daily hit rate there’s not much that user can do about it. I think in those cases, the temp suspensions seems a tad unjust.

On the second point:
I use FileZilla to take backups of the production files, so those files I have local copies of. But the website I was working on was the dev/test website so I don’t have a backups of those. I tried to do so this morning but due to the suspension I wasn’t able to. If there is a way to backup files automatically then I’m very interested in learning how to do that!

Thanks for offering a hand, here’s a description of what goes on behind the scenes of the website. (I’d prefer to show you the site but it’s currently suspended)

Essentially, it’s a Pokemon database of a non-profit fan game that I have helped build. The site is used to search for a particular pokemon to help players with their teambuilding strategies.
In fan games, the metadata of moves, abilities, pokemon and other game related info is stored in separate txt files.
These files are manually uploaded to the server as .js files and variables are assigned to each file. var abilitiesTxt for abilities, pokemonTxt for pokemon, movesTxt for moves etc etc.
The main premise of the site is to allow players to filter the database however they would like. I.e. pokemon with a specific type, pokemon with a specific move, pokemon with a specific name etc.

The problem I’m having is the site is using a large amount of RAM when viewing and I’m looking for ways (if any) to optimise that.
There are around 1068 pokemon, each pokemon has it’s own little table detailing the moves it learns as it levels, the abilities it has and other info assigned to it. Here’s a snippet of what it looks like:

I’ve taken some steps to limit daily hit rate by combining all the .js files together. (The pokemon, abilities and moves are put into one called DataFiles.js). I’ve applied lazy loading to the images/sprites.
The images themselves are uploaded on Google Drive rather than uploaded on the server itself. There’s a mapping mechanism that I’ve built where each pokemon ID maps to a specific Google Drive Image File ID so that the image belonging to that pokemon can be rendered. That mapping is stored in another .js file. The index.html calls all the .js files.

There is a caching mechansim whereby each .js file is written as “example.js?1.1” so the website caches on first load and when the metadata changes I then add 1 to the version of the js file I’ve made changes to so that a fresh copy can be loaded. These metadata changes occur once every 3 months usually. (example.js?1.1 becomes example.js?1.2)

In total there are 5 .js files, 2 .css files and 1 j-query file that the site loads each time. So not many hits are generated each time.

Apologies for the long-winded explanation, there’s only so much I can do whilst the website is suspended so I think the detail is warranted.
Based on that, if there’s anything that instantly calls out to you then please provide me your wisdom. When the site returns tomorrow, I will drop the link here again and you can have a look for yourself how the website is built.

Thanks for reading!

There is not unfortunately. The recommended way to make changes is to do it locally and upload the resulting files over FTP.

For modifications that have to be done from a CMS control panel, backing up the relevant files / database every week and after every major change is generally a good idea.

2 Likes

Ok no worries, thanks for the tip. Guess I’ll wait for the suspension to pass

If you find this one helpful, just visit this named as techtobard one and see what changes have been made by minifying larger size files to proper internal linking. This will clear the concept of proper indexing procedure along with the site speed optimization.

Not true

Just one visit to

will generate close to 1100 hits

Mind you, this is only for one page view

3 Likes

Ok, that’s really odd because I kept a watchful eye on the daily hits when I first implemented the image mapping mechanism and it wasn’t reaching that many when the page is loaded.
I recognize that as the user scrolls the lazy loading element will activate but my concern was on first load.
I’m getting:

The only thing I can think of is to add a sprite sheet and have it so the appropriate sprite is called based on the pokemon id. It’s a one to one relationship between sprite name + pokemon id:
001.png = [1] (bulbasaur), 002.png = [2] (Ivysaur) etc. Therefore, each sprite within a spritesheet will need to have the 001, 002 embedded somehow in order for the sprite to appear in accordance with the pokemon id

But in terms of being able to assign a position to each sprite and dynamically call it from index.html is something I have no idea how to do…

1 Like

Managed to solve the memory consumption issue by adding a pagination mechanism to the site, displaying a max of 200 per page.

This reduced the RAM usage from a max of 1.8 GB to just 271 MB!

Thanks all for your inputs!

5 Likes

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.