Nicht Zu Vergessen: Container Anfragen

0
7

Container-Abfragen werden immer auf der Spitze der Liste der gewünschten Verbesserungen zu CSS. Die Allgemeine Stimmung ist, dass, wenn wir hatten-container-Anfragen, würden wir nicht schreiben, wie viele global media queries auf Seite Größe. Das ist, weil wir tatsächlich versuchen, die Kontrolle mehr scoped-container, und der einzige Grund, warum wir die Verwendung von media-queries für die, die jetzt ist, weil es ist das beste Werkzeug haben wir in CSS. Ich absolut der Meinung, dass.

Es ist ein anderes Gefühl, das geht um einmal in eine Weile, dass geht so etwas wie: “du Entwickler denken, Sie brauchen container Abfragen, aber Sie wirklich nicht.” Ich bin nicht so der fan von. Es scheint furchtbar offensichtlich, dass würden wir machen gute Dinge mit Ihnen, wenn Sie verfügbar waren, nicht zuletzt von denen ist das schreiben von sauberer, Tragbarer, verständlichen code. Jeder scheint zu vereinbaren, dass der Aufbau von UIs-Komponenten ist der Weg zu gehen in diesen Tagen die macht der Notwendigkeit für container alle Abfragen, die mehr auf der Hand.

Es ist wunderbar, dass es moderne JavaScript-Ideen, die uns helfen wollen, verwenden Sie heute ist — aber das bedeutet nicht, dass die Technik braucht, um dort zu bleiben. Es macht mehr Sinn, in CSS.

Hier ist mein Ende 2019 dachte dump auf das Thema:

  • Philip Walton ‘ s “Responsive Komponenten: eine Lösung für die Container-Abfragen-Problem” ist ein großartiger Blick auf die Verwendung von JavaScript, ResizeObserver als eine Möglichkeit, um das Problem zu lösen heute. Es führt Super und funktioniert überall. Die demo-site ist das beste heraus dort ist, weil es unterstreicht die Notwendigkeit für responsive Komponenten (obwohl es auch andere dokumentierte Anwendungsfälle, wie gut). Philip selbst sagt, eine Reine CSS-Lösung wäre ideal.
  • CSS Verschachtelung hat eine kleine Runde von Begeisterung über ein Jahr her. Das Gespräch macht es scheinen, wie die Verschachtelung ist plausibel. Bin ich dafür, dies als langjähriger fan von vernünftig Sass Verschachtelung. Es macht mich Frage mich, ob die syntax für container Abfragen könnte, nutzen die gleiche Art von Sache. Vielleicht geschachtelte Abfragen bezieht sich auf den parent selector? Oder Sie das Präfix der Medien-Anweisung mit einem kaufmännischen und-wie die aktuelle Skillung nicht mit Nachfahren-Selektoren?
  • Andere vorgeschlagene Syntax beinhalten in der Regel dem Doppelpunkt, wie .container:media(max-width: 400px) { }. Ich mag das auch. Single-colon-Selektoren (pseduo-Selektoren) sind philosophisch “wählen Sie das element aus, unter diesen Bedingungen” — wie :hover, :nth-child, etc. — so ein media-Bereich Sinn macht.
  • Ich glaube nicht, dass die syntax ist der größte Feind dieses feature; es ist die Leistung, wie es implementiert ist. Zuletzt habe ich verstanden, es ist nicht einmal die Leistung so viel wie es düngt mit der gesamten rendering-flow, wie Browser funktionieren. Das scheint wie eine riesige Hürde. Ich noch nicht, will es vergessen. Es gibt viel innovation, was auf dem web und, nur weil es nicht klar ist, wie es zu realisieren heute, dass heißt nicht, dass jemand nicht herausfinden, einen praktischen Weg in die Zukunft von morgen.