[css-grid] Allow huge grid to be inspected without freezing the page

Since r629436, trying to inspect a 1000x1000 grid in the devtools would
freeze the page. That's because, when determining the areas to be
highlighted, the code would try to encode each cell independently.
But there can be way too many cells.

This patch changes it to encode the rows and the columns, making the
algorithm linear instead of quadratic.

The `highlights` object returned by `Overlay.getHighlightObjectForTest`
now no longer has a `cells` property, and instead has separate `rows`
and `columns` properties.

I have ensured that with this patch it will be possible to inspect
1000x1000 grid (the current limit) reasonably fast. If I raise the limit
to 10000x10000, then it still works well in release builds, but in debug
ones it takes almost 2 minutes.

BUG=1067748

TEST=http/tests/devtools/elements/highlight/highlight-css-grid.js
TEST=http/tests/devtools/elements/highlight/highlight-css-grid-huge.js

Change-Id: Ic285a07550b4799d3c22026bdcd387b207f23512
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2135618
Reviewed-by: Andrey Kosyakov <caseq@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
Commit-Queue: Oriol Brufau <obrufau@igalia.com>
Cr-Commit-Position: refs/heads/master@{#756735}
5 files changed
tree: 5cdf38fcc50d2e247c542e08ef8577efe992166d
  1. .clang-format
  2. .clang-tidy
  3. .eslintrc.js
  4. .git-blame-ignore-revs
  5. .gitattributes
  6. .gitignore
  7. .gn
  8. .vpython
  9. .vpython3
  10. .yapfignore
  11. AUTHORS
  12. BUILD.gn
  13. CODE_OF_CONDUCT.md
  14. DEPS
  15. ENG_REVIEW_OWNERS
  16. LICENSE
  17. LICENSE.chromium_os
  18. OWNERS
  19. PRESUBMIT.py
  20. PRESUBMIT_test.py
  21. PRESUBMIT_test_mocks.py
  22. README.md
  23. WATCHLISTS
  24. android_webview/
  25. apps/
  26. ash/
  27. base/
  28. build/
  29. build_overrides/
  30. buildtools/
  31. cc/
  32. chrome/
  33. chromecast/
  34. chromeos/
  35. cloud_print/
  36. codereview.settings
  37. components/
  38. content/
  39. courgette/
  40. crypto/
  41. dbus/
  42. device/
  43. docs/
  44. extensions/
  45. fuchsia/
  46. gin/
  47. google_apis/
  48. google_update/
  49. gpu/
  50. headless/
  51. infra/
  52. ios/
  53. ipc/
  54. jingle/
  55. media/
  56. mojo/
  57. native_client_sdk/
  58. net/
  59. pdf/
  60. ppapi/
  61. printing/
  62. remoting/
  63. rlz/
  64. sandbox/
  65. services/
  66. skia/
  67. sql/
  68. storage/
  69. styleguide/
  70. testing/
  71. third_party/
  72. tools/
  73. ui/
  74. url/
  75. weblayer/
README.md

Logo Chromium

Chromium is an open-source browser project that aims to build a safer, faster, and more stable way for all users to experience the web.

The project's web site is https://www.chromium.org.

Documentation in the source is rooted in docs/README.md.

Learn how to Get Around the Chromium Source Code Directory Structure .

For historical reasons, there are some small top level directories. Now the guidance is that new top level directories are for product (e.g. Chrome, Android WebView, Ash). Even if these products have multiple executables, the code should be in subdirectories of the product.