Roll20 uses cookies to improve your experience on our site. Cookies enable you to enjoy certain features, social sharing functionality, and tailor message and display ads to your interests on our site and others. They also help us understand how our site is being used. By continuing to use our site, you consent to our use of cookies. Update your cookie preferences .
×
Create a free account

Attn Sheet Authors: Compatibility with Roll20 for iPad/Android

Hey everyone, One of the things that I'm trying to do as I work on the new Roll20 for iPad and Roll20 for Android apps is test how well our sheets are performing. As I notice things that may need to be changed/tweaked, I'll make a note of them here. If you want to dive in and adjust your sheets yourselves, feel free, otherwise I will hopefully get around to making them myself before we launch the Update of Holding. Tabbed Content Several of the more "complicated" sheets (5E, Pathfinder, etc.) make use of tabs to hide/show sections of the sheet. We've optimized the way that this functionality works based on what everyone has done, but one thing I noticed is that some folks are using a lot of attributes such as "visibility: hidden; max-height: 0; opacity: 0;" to hide the content that shouldn't be shown. While this works, it's extremely bad from a performance standpoint based on my testing on old computers and tablets (which don't have the processing power of a desktop). I think the main reason it was done this way was to enable an opacity-based "fade" transition. As these sheets have gotten more and more complicated, I think we need to focus on making them respond as quickly as possible. So I'm going to recommend that everyone switch to a simple "display: block;" and "display: none;" instead of messing with visibility, opacity, etc. In my testing with the 5E sheet on my iPad Mini, this makes a huge difference, helping the sheet go from "taking forever to switch tabs" to feeling very, very responsive. I submitted a change to fix this in the 5E sheet (although I'm waiting to hear back from Actoba to push it live for everyone), which you can see here to give you an idea of what change I'm talking about: <a href="https://github.com/Roll20/roll20-character-sheets/" rel="nofollow">https://github.com/Roll20/roll20-character-sheets/</a>... Thanks!
1421622804

Edited 1421630398
Lithl
Pro
Sheet Author
API Scripter
I would be willing to bet in the case of some (or possibly many) tabbed sheets, the reason has less to do with wanting a transition and more to do with trying visibility:hidden and/or opacity:0 and discovering that the element still takes up space, adding the rest to "collapse" it. display:none is great because the element no longer takes up space; for an effect like tabs, it is definitely superior to visibility or opacity.
1421625291
Actoba
Pro
Sheet Author
Have already replied to the commit linked above, the change is fine and simply replaces the transition animation. The only reason for the old method was indded to allow the transition animation. "display" with transitions still doesnt work reliably cross browser...hence the other stuff to collapse the sections down to effectively hide them.
1421720983
Sam M.
Pro
Sheet Author
I'm still using opacity to hide sections of the sheet. Any ideas on how to get around that?
Sam said: I'm still using opacity to hide sections of the sheet. Any ideas on how to get around that? Which sections? If it's just a few places it's fine. It's just when you're doing it for like the entire tab that it's a problem.
This was an excellent change really. I noticed in the last week or so, that spellbooks on the 5e sheet (admittedly edited so I could set the buttons to generate PowerCards) were drastically slowing down the Character Sheet. Druids, Clerics and several other classes "know" all the spells, and entering them all into the Character Sheet slowed it down so much, it was taking about a full second or so to switch tabs, or even open up the sheet. This change cut the time for the sheet down a lot .
1421775066
Sam M.
Pro
Sheet Author
Riley D. said: Sam said: I'm still using opacity to hide sections of the sheet. Any ideas on how to get around that? Which sections? If it's just a few places it's fine. It's just when you're doing it for like the entire tab that it's a problem. I'm using it to hide sections within a tab, not the whole tab itself (I've already done the display replacements for that).
1421782624
Actoba
Pro
Sheet Author
Sean G. said: This was an excellent change really. I noticed in the last week or so, that spellbooks on the 5e sheet (admittedly edited so I could set the buttons to generate PowerCards) were drastically slowing down the Character Sheet. Whilst the opacity changes would have had some impact on this I believe the much more significant impact you are seeing is as a result of the other optimisations made to character sheets that are currently on the dev server. Specifically the only saving changed fields when a sheet is updated. For tablets though, yeah I can imagine the opacity/tranisition removal is a bigger deal
Oh, I would agree it would go faster on the Dev server, but I made these changes on the live server to the character sheet I edited to change the buttons to produce a PowerCard. What I noticed a week or two ago, was that without these changes, if a character sheet had a lot of spells in the spellbook area (read: every spell, for a given slot level, for some classes that have access to all), the character sheet was drastically slowed down. While I am sure it is due to how (as you pointed out) the fields were updated based upon changing tabs, this change brought the character sheets back to a decent speed.
1421794130
Actoba
Pro
Sheet Author
Fair enough...I didnt realise it was quite as big of a performance hog normally or I would have removed them before now :)
I didn't know it was them either, to be honest. Like I said, I never even noticed there being any kind of a problem with it, until I made a Druid and had to add all the spells to the spellbook. My rogue never seemed to take any time, so I just never ever noticed.
Sam said: Riley D. said: Sam said: I'm still using opacity to hide sections of the sheet. Any ideas on how to get around that? Which sections? If it's just a few places it's fine. It's just when you're doing it for like the entire tab that it's a problem. I'm using it to hide sections within a tab, not the whole tab itself (I've already done the display replacements for that). Go ahead and just go with that for now, and then I'll let you know if I still notice issues.
1421942109
Sam M.
Pro
Sheet Author
Sounds good, thanks Riley.