OK, thanks. I was being misled by the âAccelerated Mobile Pagesâ title.
Unfortunately, it seems to rely on JS for layout, if the rather broken (on my desktop browser) AMP site is anything to go by. Iâm afraid it doesnât inspire me to go that route.
Well, actually, I mentioned this to the top management, by they do not want to reload / ajax etc. They want to scroll horizontally and get to any date.
Actually there are 5 tables each with some columns for general info and then columns for dates (from 2 months back from today to 1 next year - so its like 365+60 columns) - there is not much data in each cell it may have only numbers from 1-9 however, having so many columns is not good idea.
So this is the reason why I have to put this much columns.
Customer are not always right and showing 400 columns by default is just too silly. No one will understand that damn table. The point of the table is to organize the data to quickly analyze the data. Hereâs what I propose.
Show 100 rows per page and have pagination
Show top 10 columns and hide the others. You can create a simple filter to show the âcheckedâ columns list.
Create a Excel export option with that crazy 400 columns. This way they can download it and do whatever the heck they want.
If you must show it then donât use <table> tag as that will take a long time to re-render. Use a <div> version of table and put a script to detect that visible rows are actually visible on the browser. Hereâs an example of library called wow.js, it activates html element upon being visible.
Again, I do not recommend showing all 400 columns by default and do not use <table> tag.
Nobody can grasp a table with 400 columns in it, no matter what they say.
I would start with a column per month, so summed over all values within that month, and then make it so you âzoom inâ to a month to see the breakdown of all values within a month.
If you want you could also add a side-by-side where you show two selected months for example. That would also make it easier to compare february and november for example, which would be very hard with all those other months in the way like it is now.
Anyway, if youâre really stuck with this format, you should probably look at what the javascript is doing and se if it can be optimised. Without seeing any javascript though itâs hard to predict what the culprit might be.
The usual suspect with so many cells is that you are using a lot of event listeners on a lot elements where you should be using event delegation.
Well so after too many revisions back and forth, we have decided to show the data for only 90 days on 1 screen and then the user must click on a different period to saw its data.