[webkit-dev] CSS Grid Layout status review

[Javier Fernandez]

Hi all,

It's been a while since Igalia started contributing to the development
of the CSS Grid Layout spec in WebKit (enabled in the nightly builds
since May) and we'd like to report about the implementation status to
gather feedback from the community (comments, issues, questions, etc.).

CSS Grid Layout is a browser feature that allows to define responsive
and flexible 2D layouts using just CSS declarations. Visit
http://www.w3.org/TR/css-grid-1/ for more information about the standard.

First of all, the following meta-bug can be used to track the
implementation: http://webkit.org/b/60731

Besides a quite active bugfixing, these are the most important changes
that have been landed recently:

* Introduce compilation flag (http://webkit.org/b/129153) and remove
runtime feature http://webkit.org/b/132382 (thus CSS Grid Layout is
enabled in the nightly builds since May).

* Syntax implementation:
  - Adapting some properties to the last specification:
http://webkit.org/b/127987
     + grid-template-{columns, rows} and grid-template-areas
  - grid-template: Explicit Grid shorthand: http://webkit.org/b/128980
  - grid: Grid Definition Shorthand: http://webkit.org/b/132122

* Code refactoring:
  - Grid position resolution code moved to its own class:
http://webkit.org/b/131732

* Auto-Placement algorithm:
  - Add support for spanning items: http://webkit.org/b/110633

* Z-index:
  - Properly support z-index property on grid items:
http://webkit.org/b/103329

* Alignment and justification:
  - Implement justify-self css property:  http://webkit.org/b/134419

In addition, we're actively working on the following features:

* Alignment and justification:
  - Implement row-axis Alignment:  http://webkit.org/b/133222
  - Implement column-axis Alignment:  http://webkit.org/b/133224
  - Improve margin, border and padding support.

* Auto-placement algorithm:
  - Implement the new sparse and stack modes: http://webkit.org/b/103316

* Performance optimizations:
  - meta-bug to track future optimizations: http://webkit.org/b/125145
  - Dirty bit on grids: http://webkit.org/b/132332

We hope you find this report useful so people interested on this feature
could be aware of our progress and future work. Please, don't hesitate
to give us any kind of feedback; it's really appreciated.

Finally, stating that we're planning to continue working on the
implementation of this spec with the goal of asking before the end of
the year to be considered for shipping . Let's see how all this evolves
and we'll keep you informed.

Best regards.