[5e Shaped] Sheet loading time has significantly increased

1439659231

Edited 1439667257

Pro

Sheet Author

API Scripter

Permalink Quote

Recently there was a fix that was supposed to decrease the time to load a creature with a lot of attributes. Currently it is taking about ~300-330ms to load the html and then between ~1200-10,000ms to load a character on the 5e shaped sheet. More attributes (like spells, which are repeating) makes it take much much longer. Show token's character... app.js?1439300327:36 Show Character View Dialog! app.js?1439300327:36 --- RENDER CHARACTIVE VIEW ---- app.js?1439300327:36 CLICKED app.js?1439300327:36 Redoing charsheet html jquery.min.js:2 Mixed Content: The page at '<a href="https://app.roll20.net/editor/" rel="nofollow">https://app.roll20.net/editor/</a>' was loaded over HTTPS, but requested an insecure image '<a href="http://imgsrv.roll20.net/?src=i.imgur.com/4725LWH.png" rel="nofollow">http://imgsrv.roll20.net/?src=i.imgur.com/4725LWH.png</a>'. This content should also be served over HTTPS. app.js?1439300327:36 327ms to end of html app.js?1439300327:36 CLICKED app.js?1439300327:36 Updating character sheet values app.js?1439300327:36 Updating ALL VALUES app.js?1439300327:36 Appending to sheetform app.js?1439300327:36 Took 9956ms Another example: Show token's character... app.js?1439300327:36 Show Character View Dialog! app.js?1439300327:36 --- RENDER CHARACTIVE VIEW ---- app.js?1439300327:36 CLICKED app.js?1439300327:36 Redoing charsheet html jquery.min.js:2 Mixed Content: The page at '<a href="https://app.roll20.net/editor/" rel="nofollow">https://app.roll20.net/editor/</a>' was loaded over HTTPS, but requested an insecure image '<a href="http://imgsrv.roll20.net/?src=i.imgur.com/4725LWH.png" rel="nofollow">http://imgsrv.roll20.net/?src=i.imgur.com/4725LWH.png</a>'. This content should also be served over HTTPS. app.js?1439300327:36 319ms to end of html app.js?1439300327:36 CLICKED app.js?1439300327:36 Updating character sheet values app.js?1439300327:36 Updating ALL VALUES app.js?1439300327:36 Appending to sheetform app.js?1439300327:36 Took 4438ms A creature without spells was taking around 1250ms. Are there any improvements that can be made? It seems repeating attributes are the worst offenders by far.

1439676961

Edited 1439677186

Roll20 Team

Permalink Quote

I spent a bit of time looking into this because I'm interested in making the Character Sheet system work well with everything sheet authors want to do with it. Here are my thoughts: We made two changes recently. The first one only affected loading the Token Settings dialog box, and just stripped out showing attributes that are in repeating sections from showing up in the "Bar Link" dropdown menus. That wouldn't affect this at all, but it did specifically speed up this sheet for that particular user interaction since it has so many attributes (for many people opening the Token Settings dialog box with this sheet active was nigh unusable). The only other thing we did was to make it to where when a base attribute changes, the associated _max attributes for that base attribute also get updated. We have a "smart" updater that kicks in when you change an attribute on a sheet after it's already opened so that rather than needing to update the whole sheet, it only updates the attributes that "depend" on that attribute (based on a dependency tree that's calculated when the game is first loaded in). Based on the console log you are presenting, it looks like the processing time you are showing is for when the sheet loads the first time, in which case "ALL VALUES" must be updated because none of them have been filled in yet. So again, this change should not have affected things. Looking at the history of the sheet ( <a href="https://github.com/Roll20/roll20-character-sheets/" rel="nofollow">https://github.com/Roll20/roll20-character-sheets/</a>... ) it looks like there have been some major changes to the sheet layout since the update went live -- is it possible that one of those changed something about the sheet that might have lead to this happening? You mentioned that you think spells are a contributing factor, and I'm noticing based on the commit messages that since the update launched, there's been a major change to the way the spells are handled on the sheet? It might be useful to try getting an old version of the sheet from a few weeks ago, and putting it into a campaign as a Custom sheet, and then comparing the performance of that older version versus the new version, and seeing if there is a large difference. To be honest, the 5E Shaped Sheet now has a significantly larger number of attributes than any other sheet by a long shot. Taking a quick look, it now has more than 5,000 attributes (and that's just the default sheet without any repeating fields added), whereas the regular 5E sheet has 2,400 and the Pathfinder sheet (which I used to consider the "biggest" one) has 2,800.  More attributes means more calculations to load a sheet, both in terms of the browser rendering the fields for the attribute, and in terms of the auto-calculated fields being updated. I'm wondering if maybe the sheet is finally reaching a point where the current system simply can't accommodate that many attributes. And it may not even be our system -- rendering the HTML for 4,400+ inputs/selects/textareas on a page is just going to take a long time for a browser to do, no matter what. Are there any changes that were recently made to the sheet that would have significantly increased the number of attributes?

1439679253

Edited 1439680117

Pro

Sheet Author

API Scripter

Permalink Quote

Firstly, thanks for spending some time to look into this issue and providing a thorough response - especially on a weekend. Recent Changes:  Right, it was the bar link dropdowns that were stripped, my mistake. _max change: Ya, it wouldn't effect this loading issue either. I was refering to the other change, but forgot exactly what it did. Changes to 5e Shaped: If you look at this history of my sheet there are major changes every few days. :P That said I've just tested a character on multiple campaigns: My current live code tests exactly as above. When I tested it again just now it was about ~5,000ms. The roll20 version of the sheet (10th Aug) version is nearly the same (~5,000ms). I've loaded my code from July 2nd and the time is nearly the same. 209ms to end of html and ~4,000ms to display. So there has been a slight degredation of speed, but it isn't significant. If I had run this test when the servers were slower to respond earlier then I'd expect the current sheet to be back around 9s and the July 2nd version to be around 7.5 or 8s. Number of attributes:  I would happily cut down on the attributes in favor of repeating if we could get  Official support for repeating sections in character sheets . Reily please! (Can this be a new thing like "Rito please!" or "Blizzard please!") . Though as per my tests it seems characters with several ~15 repeating spells are significantly more laggy than those without (~9,000ms vs ~1,200ns as shown above). And the 1,200ms guy still has actions and everything else. If repeating did work I could cut down to about 1/4 the number of attributes, but as it stands I have to use a build script to duplicate code to the amount of items needed (weapons for instance make 7 of each type, actions make 11. Each of which has many attributes and toggles which create more attributes). It is really cool to see the number of attributes though. HTML Supporting that many attributes: Indeed loading that many DOM elements is expensive, though I've minified the HTML to be 1.44MB and the CSS to be 61 KB - still about double of any other sheet. Official support for tabs (with the other tabs lazily loading) would significantly reduce the payload delivered. Recent increase in number of attributes:  As mentioned above there are significant changes every few days to my sheet. I did a lot of refactoring for consistency/optimization today, but based on my test above those would have little effect on loading. One other thing to check may be to ensure that hidden attributes don't have any kind of watch on them. I use a lot of those for checkbox toggles so that I can change the values later without the users losing their values. The Takeaway:  Repeating elements take significantly longer to load. I would suggest you see if there is something there that takes it significantly longer. Thanks again for looking into this.

1439685272

Edited 1439685640

Roll20 Team

Permalink Quote

To clear up a few points: I had thought based on your first post, that you were saying you had seen a significant difference in the rendering time of the sheet recently? Is that true or am I misinterpreting the post? I guess I'm asking, is this something where "it was working way faster two weeks ago and now it's 3 times as slow", or is this more of a "hey it's been slow for a while but we've built to a point over time where it's now unusable." And if it was faster two weeks ago and now it's 3 times as slow, do you have a console log with timings for the same campaign from before I can look at to compare? And you're saying that if you load in a totally blank sheet, it takes 1,200 ms to load, but then if you add only 15 spells to that sheet, it now takes over 9,000ms to load on the same computer? And is this on your computer?  For reference, a new character with the 5E Shaped sheet only takes 350ms to load on my computer, but I have a pretty fast computer, so just checking. I added 10 spells to it and it increased to 550ms. That said, it looks like each repeating spell section is adding around 150 new attributes right now -- so it's very possible that adding a bunch of spells would drastically increase the time to render since 10 spells added just increased the total number of attributes by 20%+. Finally, the size of your minified HTML and CSS isn't going to affect how long the rendering takes at all. The only thing that will affect is how long it takes for the initial game data to download from our server. So it helps, but it's not relevant to this issue. The only thing that would be affecting those timings is 1) How long it takes the browser to render all of those elements (which is related to how many elements you have on your sheet, e.g. inputs, selects, hidden inputs, etc., not the size of the HTML/CSS minified or not), and 2) how long it takes our system to fill in the values on all of those elements. We might be able to do some work on our end to speed up 2), but 1) is out of our hands. I will try and put together some code to see if we can nail down which is the cause of the majority of the issue. For your hidden attributes, are you using the attr_ naming scheme for them (is their name set to "attr_something")? If so, then yes even if they are hidden they are still being calculated. Even if they aren't attributes and aren't being calculated, they would still contribute toward the HTML rendering side of things. If you want to know how many attributes your sheet currently has for a Character, open up only that sheet, and then in your Javascript console run: $(".charsheet *[name^=attr_]").length;

1439686095

Roll20 Team

Permalink Quote

Also do you have a Campaign you can give me the link to that you are doing your testing in with fully filled-in characters? That would probably help make sure we are on the same page so I can test it with real-world data instead of just test data.

1439686900

Edited 1439687168

Pro

Sheet Author

API Scripter

Permalink Quote

Recent slowness: It has always been a bit laggy. A bit worse lately. I made a post today due to it being ~10s. I think that was mostly due to server usage. "hey it's been slow for a while but we've built to a point over time where it's now unusable." is a bit dramatic, but that is the more accurate of the two. Totally blank: Takes 182ms to load the html and then 737ms to append it. A normalish character sheet is around the 5,000ms that I put above. The more attributes filled, the slower. I just did a test now: I loaded a character, got 5278ms. I removed 16 spells, refreshed, and then loaded the same character and got 1746ms. I added 11 spells via my importer (they have full details), refreshed, and then loaded the same character and got 2792ms. I'm on an optimized computer as well. The numbers I'm giving you are from the console.log. Example again: Show token's character... app.js?1439300327:36 Show Character View Dialog! app.js?1439300327:36 --- RENDER CHARACTIVE VIEW ---- app.js?1439300327:36 CLICKED app.js?1439300327:36 Redoing charsheet html jquery.min.js:2 Mixed Content: The page at '<a href="https://app.roll20.net/editor/" rel="nofollow">https://app.roll20.net/editor/</a>' was loaded over HTTPS, but requested an insecure image '<a href="http://imgsrv.roll20.net/?src=i.imgur.com/4725LWH.png" rel="nofollow">http://imgsrv.roll20.net/?src=i.imgur.com/4725LWH.png</a>'. This content should also be served over HTTPS. app.js?1439300327:36 257ms to end of html app.js?1439300327:36 CLICKED app.js?1439300327:36 Updating character sheet values app.js?1439300327:36 Updating ALL VALUES app.js?1439300327:36 Appending to sheetform app.js?1439300327:36 Took 2792ms #2: Based on my test above there is a significant difference for repeating attributes. If that was fixed #1 would be inconsequential. #1:  This is likely out of your hands as your said. Plus there is likely little to gain here. #2 is the issue imo. Though just to mention: From what I can see you're loading the sheet into the DOM every time a character is open. I'm not sure if you're using js templating, but if you're not it can increase the speed. Underscore (which you use) has a fast templating system. Though maybe you're already using it - in which case there isn't anything you can do. Hidden Attributes: yup, using the "attr_" naming convention. Here is a typical example: <input type="hidden" name="attr_repeating_weapons_melee_0_var_emote" value="{{emote=@{repeating_weapons_melee_0_emote}}}"> <input type="checkbox" name="attr_repeating_weapons_melee_0_toggle_emote" class="sheet-toggle-emote" value="@{repeating_weapons_melee_0_var_emote}"><span class="sheet-toggle-emote">Emote</span> I put the value on the hidden input and reference that input on the checkbox. That way if I ever want to change that value at a later point I can do so without every user who has previously toggled losing the data. Number of inputs: The character I mentioned above that now has 11 spells has 6501 attributes. Ha. A clean sheet had 5187. The speed difference is quite significant 519ms vs 2847ms - most of that being those 11 spells.

1439686985

Pro

Sheet Author

API Scripter

Permalink Quote

PM'd you join link. I'm off to bed soon, but I can make you GM if you join soonish.

1439687220

Roll20 Team

Permalink Quote

Okay, thanks, that's helpful. One other thing, if you change something on the sheet, you should get the same set of numbers in the log but they should be much smaller. If you change something in one of the repeating sections, what sort of numbers are you getting? Just curious. You're right if adding and removing the spell sections is causing the same computer to swing that wildly there definitely might be something going on there. We are using jQote2 for the templating already, which is really, really fast. The first number ("to end of HTML") is how long it takes the template to generate the HTML, so that's not the problem. The second number is how long it takes to fill in the actual values to the HTML and append the HTML to the DOM.

1439687756

Edited 1439687780

Pro

Sheet Author

API Scripter

Permalink Quote

Riley D. said: One other thing, if you change something on the sheet, you should get the same set of numbers in the log but they should be much smaller. If you change something in one of the repeating sections, what sort of numbers are you getting? Just curious. The numbers I put above are for loading. Changing data is quite snappy (in most cases). Toggling a checkbox in a repeating section (spells) is snappy ~160ms-240ms. Though I have a SUUUPER laagy one. If you toggle pc/npc at the top it takes ~2,200ms. Some of that is likely the css swapping, but most is probably attributes recalculating (though there aren't that many, it's mostly css) Also, duh, you don't need me to make you GM. You can do whatever you want with the system. :P "Magnus" is the super slow loader - he's a PC from my game. "Dakra" is my test dummy that I removed and re-added spells to. The monsters are imported and none have spells. The generic names have next to no data.

1439802667

Pro

Permalink Quote

mark, you requested the java console of me opening my wizardspellbook character, since it was taking so long. here goes Show Character View Dialog! app.js?1439300327:36 --- RENDER CHARACTIVE VIEW ---- app.js?1439300327:36 CLICKED app.js?1439300327:36 Redoing charsheet html jquery.min.js:2 Mixed Content: The page at '<a href="https://app.roll20.net/editor/" rel="nofollow">https://app.roll20.net/editor/</a>' was loaded over HTTPS, but requested an insecure image '<a href="http://imgsrv.roll20.net/?src=i.imgur.com/4725LWH.png" rel="nofollow">http://imgsrv.roll20.net/?src=i.imgur.com/4725LWH.png</a>'. This content should also be served over HTTPS. app.js?1439300327:36 352ms to end of html app.js?1439300327:36 [div.dialog.characterdialog, context: div.dialog.characterdialog] app.js?1439300327:36 [prevObject: p.fn.p.init[1], context: div.dialog.characterdialog, selector: ".parent()"] app.js?1439300327:36 Show Character View Dialog! app.js?1439300327:36 Already has child window! app.js?1439300327:36 Updating character sheet values app.js?1439300327:36 Updating ALL VALUES app.js?1439300327:36 ERROR: Unable to find attribute character_name_output in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute Target|AC in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute character_name_output in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute Target|AC in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute character_name_output in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute Target|AC in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute character_name_output in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute Target|AC in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute character_name_output in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute Target|AC in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute character_name_output in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute Target|AC in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute character_name_output in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute Target|AC in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute character_name_output in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute Target|AC in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute character_name_output in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute Target|AC in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute character_name_output in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute Target|AC in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute character_name_output in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute Target|AC in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute character_name_output in auto-calc formula. app.js?1439300327:36 ERROR: Unable to find attribute Target|AC in auto-calc formula. app.js?1439300327:36 Appending to sheetform app.js?1439300327:36 Took 62121ms app.js?1439300327:36 Setting style element in child window. app.js?1439300327:36 CLICKED

1439803480

Pro

Sheet Author

API Scripter

Permalink Quote

62,121ms ... LOL. WOW. I guess this is the worst case scenario on a slow computer. (there does seem to be a small error on your sheet with the "character_name_output" - if you want to fix that post on the other thread)

1439804089

Pro

Permalink Quote

Mark said: 62,121ms ... LOL. WOW. I guess this is the worst case scenario on a slow computer. (there does seem to be a small error on your sheet with the "character_name_output" - if you want to fix that post on the other thread) yeah, i wasn't joking. if my boss had his way, this would be an apple 2c. not because he likes apple, just because he would have bought it when i was 8. to my left there is a card reader/writer that is as old as i am. he only replaced the 30 year old phone trunk when our tech told him there were no more parts for it anywhere. the only reason we have computers capable of accessing the internet at work, is that the chain we are a franchise of requires it. i am pretty sure he thinks they run by way of demons. 

1440595390

Edited 1440595625

Pro

Sheet Author

API Scripter

Permalink Quote

It seems you've added some more logging so I'm adding some more info in case it helps. This is for a brand new character with 74 spells (14794 attributes): 193ms to end of html app.js?1440099982:36 Updating character sheet values app.js?1440099982:36 Setting up repeating sections took until 356ms app.js?1440099982:36 Updating ALL VALUES app.js?1440099982:36 Finding list of dirty attributes took until 357ms app.js?1440099982:36 Querytest took until 361ms app.js?1440099982:36 Set values took until 10486ms app.js?1440099982:36 Appending to sheetform app.js?1440099982:36 Appending to screen took until 10539ms app.js?1440099982:36 Took 10539ms A character with no spells (5330 attributes): 192ms to end of html app.js:36 Updating character sheet values app.js:36 Setting up repeating sections took until 8ms app.js:36 Updating ALL VALUES app.js:36 Finding list of dirty attributes took until 8ms app.js:36 Querytest took until 9ms app.js:36 Set values took until 1096ms app.js:36 Appending to sheetform app.js:36 Appending to screen took until 1108ms app.js:36 Took 1108ms Each spell has 128 attributes, which is 9472 attributes for 74 of them. Deleting one was horrendously long: Updating character sheet values app.js:36 Setting up repeating sections took until 27ms app.js:36 Finding list of dirty attributes took until 16103ms app.js:36 Querytest took until 16107ms app.js:36 Set values took until 25390ms

1440937640

Pro

Sheet Author

API Scripter

Permalink Quote

<a href="https://app.roll20.net/forum/post/2146354/5e-shape" rel="nofollow">https://app.roll20.net/forum/post/2146354/5e-shape</a>... Similar situation as me. Druid with lots of spells. 14,000 attributes. It's taking him 4s to toggle one radio.

1440951921

Edited 1440951947

Permalink Quote

I need to re-check this with my player tomorrow, but I had a 3rd level Cleric with all 1st & 2nd spells (plus domain) added to her sheet, crash out of her browser whenever she tried to load her sheet on Wednesday. Wouldn't be surprised if this was caused by the same issue (she tried multiple browsers on multiple computers)

1440965279

Pro

Sheet Author

API Scripter

Permalink Quote

~40 spells would indeed slow it down significantly . I haven't seen it crashing though.

1440968358

Permalink Quote

Kryx said: ~40 spells would indeed slow it down significantly . I haven't seen it crashing though. I'm planning on getting her and our druid to use the spell import command to import their prepared spells from now on and remove the rest. But that will still mean 25 spells for the druid and 35 for the cleric if they get to 20th (assuming a max of +5 Wis), so the same issue could still come up eventually.

1440968924

Pro

Sheet Author

API Scripter

Permalink Quote

Spell importing doesn't help - it makes it worse. I'm hoping to try to reduce the number of attributes, but I doubt I can do so without removing functionality.

1441019513

Edited 1441019528

Pro

Sheet Author

API Scripter

Permalink Quote

A major issue that several other users and I are encounting is toggling "prepared" or several other radios takes ~4s. <a href="https://app.roll20.net/forum/permalink/2364833/" rel="nofollow">https://app.roll20.net/forum/permalink/2364833/</a> Problem is, as a prepared caster like a druid - I play one myself and I have similar issues, as does our cleric - you need to toggle the "prepared" button quite a bit during the sessions. As it is every change of prepared spells is pretty much more time consuming work than just doing it by hand on a piece of paper and rolling the dice manually. It seems clicking a radio is refreshing many thousand attributes even when that radio isn't used anywhere else.

1441477187

Permalink Quote

As the problem just got a whole lot worse gaining a level with my druid, I figured a new post in this thread might help to remind of the issue. Sorry in advance, if "bumping" a thread like this is considered rude. I just hope there is a possible for this issue :(

1

You must Login to your Roll20 Account to post a reply.

DriveThru

DMs Guild

Roll20 Characters

Dungeon Scrawl

Pathfinder Infinite

Starfinder Infinite

Roll20^® is a Registered Trademark of Roll20, LLC. All rights reserved.