Remove LegacyProfiler
[WebKit-https.git] / ManualTests / simple-image-compositing.html
1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
2    "http://www.w3.org/TR/html4/loose.dtd">
3
4 <html lang="en">
5 <head>
6   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
7   <title>Checking for simple image layer optimisation</title>
8   <style type="text/css" media="screen">
9     img {
10       float: left;
11       width: 150px;
12       height: 150px;
13     }
14     p {
15       clear: both;
16       margin: 1em 2em;
17       height: 180px;
18     }
19     img {
20       -webkit-transform: rotate3d(0, 0, 1, 0);
21     }
22    </style>
23 </head>
24 <body>
25
26   <h1>Image optimisation in layers</h1>
27
28   <p style="height: auto">
29     In order to run this test you should enable the debugging options that indicate
30     what type of compositing layer is being used.
31   </p>
32   
33 <pre>
34 defaults write com.apple.Safari WebCoreLayerRepaintCounter -bool yes
35 defaults write com.apple.Safari WebCoreLayerBorders -bool yes
36 </pre>
37   
38   <p style="height: auto">
39     Directly composited image layers will have a yellow border and no repaint counter.
40   </p>
41
42   <p>
43     <img src="resources/simple_image.png">
44     Basic image - no style - can be directly composited
45   </p>
46
47   <p>
48     <img src="resources/simple_image.png" style="border: 5px solid blue;">
49     5px blue border - can NOT be directly composited
50   </p>
51
52   <p>
53     <img src="resources/simple_image.png" style="margin: 10px 20px;">
54     margin - can NOT be directly composited
55   </p>
56
57   <p>
58     <img src="resources/simple_image.png" style="background-color: grey;">
59     solid background - can be directly composited
60   </p>
61
62   <p>
63     <img src="resources/simple_image.png" style="background: orange url(resources/simple_image.png) -50px -50px;">
64     background image - can NOT be directly composited
65   </p>
66
67   <p>
68     <img src="resources/simple_image.png" style="-webkit-transform: rotate3d(0, 0, 1, 10deg);">
69     rotated but otherwise no style - can be directly composited
70   </p>
71
72
73
74
75 </body>
76 </html>