Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Before <a href="https://stackoverflow.com/a/31538886/2190172">the <code>will-change</code> directive</a>, you couldn't do this in the same literal way that you can in other languages. The browser (or at least Webkit) dealt with rendering the page by drawing various layers. It should in theory be intelligent enough to work out the layers for you, but sometimes it was a good idea to force something into its own layer.</p> <p>Sometimes that worked, sometimes it didn't, depending on exactly what's going on.</p> <p>Anyway.</p> <p>In CSS, one way to force something into a layer is to transform it using a 3D transform. A common strategy is to add either:</p> <pre><code>transform: translateZ(0); </code></pre> <p>or the equivalent:</p> <pre><code>transform: translate3d(0,0,0); </code></pre> <p>or the slightly crazy:</p> <pre><code>transform: rotateZ(360deg); </code></pre> <p>or the translate ones combined with:</p> <pre><code>-webkit-backface-visibility: hidden; -webkit-perspective: 1000; </code></pre> <p>if things are flickery.</p> <p>These create a new layer as that's what the spec defines. From <a href="http://www.w3.org/TR/css3-transforms/#transform-property" rel="noreferrer">http://www.w3.org/TR/css3-transforms/#transform-property</a>, </p> <blockquote> <p>"Any value other than ‘none’ for the transform results in the creation of both a stacking context and a containing block."</p> </blockquote> <p>These all need careful testing, and aren't something to just always bung on anything that might need it – sometimes it's better, sometimes it's no different, and sometimes it's worse!</p> <p>Good luck!</p>
    singulars
    1. This table or related slice is empty.
    1. POImproving CSS3 transition performance
      singulars
      1. PTQuestion
    1. PTAnswer
    1. USCommunity
    1. USRich Bradshaw
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. POImproving CSS3 transition performance
      singulars
      1. PTQuestion
    1. This table or related slice is empty.
    1. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTAcceptedByOriginator
    1. COLooks interesting, thanks Rich. Are these all different? I mean if the `transform: translateZ(0);` has no effect, is there any point in trying the others?
      singulars
      1. PO
      1. UScronoklee
    2. COMost of these don't seem to matter anymore as of Chrome 21+ and Firefox 14+. I have noticed that they will actually DEGRADE visual quality in some cases, particularly Chrome, because it switches font rendering from using the OS rendering scheme to something that is GPU-controlled - often leading to jagged edges or unclear fonts reminiscent of IE7 / IE8 bugs when applying filters.
      singulars
      1. PO
      1. USJoshua
    3. COI agree, some times these make things better, sometimes worse. It really depends on exactly what you are doing. The browser is really supposed to be able to make the best decision, so by doing this you are really forcing behaviour that may or not be a good thing! Regarding trying them all, occasionally people report success with one over the other, I'd try them all, but remember you've done it so you can remove it it if it ever looks worse!
      singulars
      1. PO
      1. USRich Bradshaw
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload