지금 CSS가 너무 많나요? PlatoBlockchain 데이터 인텔리전스. 수직 검색. 일체 포함.

지금 CSS가 너무 많습니까?

프론트엔드 개발자로서 우리는 CSS에서 사물을 중앙에 배치하고, 스타일을 캡슐화하고, 요소의 종횡비를 설정하고, 색상을 보다 세밀하게 제어하고, 자식 속성, 특정 계층 관리, 요소가 부모 너비에 응답하도록 허용… 목록은 계속해서 진행됩니다.

이제 우리는 원하는 모든 것을 얻었고 그 이상을 얻었습니다. 우리 중 일부는 묻습니다. 이제 우리는 너무 많은 CSS?

어두운 시간

나처럼 CSS의 초기 단계에 웹 개발을 시작했다면 너무 많은 것을 가지고 있다는 생각은 우스꽝스럽게 보일 것입니다.

과거에는 프론트엔드 개발자의 거의 모든 작업 설명이 CSS의 한계를 다루는 것으로 구성되었습니다. 그만큼 클리어픽스 해킹 수레를 지우려면 100% 패딩 해킹 정사각형 div를 만들기 위해 관련 없는 속성을 반 무작위로 적용하여 Internet Explorer가 입찰을 수행하도록 속이는 것은 말할 것도 없습니다.

당시 브라우저는 순전한 교활함과 신비한 주문으로 물리쳐야 하는 사악한 적이었습니다. 오늘날 완벽한 속성이 기다리고 있으며 MDN에 복사하여 붙여넣기만 하면 됩니다.

CSS의 새로운 시대

그러나 오늘날에는 상황이 크게 다릅니다. 상황이 훨씬 더 빠르게 진행될 뿐만 아니라 브라우저 공급업체도 실제로 관심 개발자를 행복하게 만드는 것! 나도 알아, 믿을 수 없었어. 하지만 나는 매년 CSS의 상태 개발자 설문조사( 그건 그렇고 지금 열어 - 가서 받아!) 그리고 브라우저 개발 팀이 로드맵을 알리기 위해 설문조사 결과(다른 많은 데이터 요소 중에서)를 사용한다는 사실을 알고 있습니다.

이 외에도 Google은 설문조사 작업에 필요한 자금을 지원해 주었습니다. 레아 베로 올해 설문조사 질문 선정에 앞장서겠습니다.

구글 뿐만이 아닙니다. 일반적으로 Safari와 Apple을 비난하는 것이 유행이 되었지만(때로는 그럴 만함), 누군가가 얼마나 열정적인지 부정할 수 없습니다. 젠 시몬스 개발자의 의견을 듣고 웹을 개선하는 것입니다.

그리고 브라우저 공급업체는 자체적으로 CSS를 개선하고 있을 뿐만 아니라; 그들은 심지어 다음과 같은 이니셔티브를 통해 전선에서 협력하고 있습니다. 상호 운용성 2023 브라우저 간의 불일치 및 비호환성을 줄이는 데 도움이 됩니다.

너무 좋은 것?

이 모든 것의 결과로 우리는 이제 CSS의 부끄러움에 직면하게 되었고 따라잡기가 어려울 수 있습니다. CSS 그리드 거의 XNUMX년 전에 주요 브라우저에서 지원되기 시작했지만 여전히 사용할 때마다 참조를 확인합니다. 그리고 멋진만큼 서브 그리드 아직 시도조차 해보지 못한 것 같습니다.

선정하는 과정에서 CSS 상태에 포함하거나 포함하지 않을 CSS 기능, Lea와 나는 많은 기능을 고려했지만 우리는 또한 꽤 많은 기능을 거부했습니다. 기능의 몇 가지 예 아니 포함:

  • XNUMXD덴탈의 linear() 완화 기능, 더 세부적으로 이징 곡선을 정의할 수 있습니다. 
  • XNUMXD덴탈의 env() 기능, 브라우저나 장치에서 정의한 변수를 사용할 수 있습니다. 
  • XNUMXD덴탈의 scrollbar-width 스크롤바의 모양을 제어하는 ​​데 도움이 되는 속성입니다. 
  • XNUMXD덴탈의 margin-trim 속성을 사용하여 컨테이너의 자식 여백이 작동하는 방식을 제어할 수 있습니다. 

이것들은 모두 잠재적으로 매우 유용하며 지난 몇 년 동안 CSS 가뭄 동안 큰 뉴스가 되었을 것입니다. 그러나 오늘날의 맥락에서 그들은 has() 선택기 또는 CSS 중첩과 같은 훨씬 더 큰 발표로 주의를 끌기 위해 싸워야 합니다!

흥분하지

실베스타 비스트로비치 쓰기, 그는 "이 모든 새로운 CSS 기능에 대해 그다지 기대하지 않습니다." 이것은 Twitter에서 메아리를 찾았습니다. 사라 수에 이단 그녀가 관심을 갖는 것은 "현재 기능이 얼마나 빛나는가가 아니라 실용성"이라고 말했습니다.

이것은 부정적인 태도처럼 보일 수 있지만 이해할 수 있다고 생각합니다. 아무도 그렇게 많은 새로운 기능을 따라갈 것이라고 기대할 수 없습니다!

의도하지 않은 또 다른 결과는 CSS가 더 복잡해질수록 브라우저 엔진을 개발하려는 새로운 회사에 대한 기준이 더 높아진다는 것입니다. 이러한 새로운 기능. 

CSS 초과

CSS가 처리하기에 적합하지 않은 영역으로 확장될 수 있다는 매우 타당한 우려도 있습니다. Sara Soueidan이 새로운 CSS Toggles 실험적 구현(여기 그것에 대해 논의하는 티켓이 있습니다.):

많은 사람들이 이러한 종류의 동작은 순전히 CSS를 통해 토글 상태를 관리하는 대신 새 HTML 요소에서 가장 잘 처리될 것이며 CSS가 접근성 문제가 적절하게 해결되도록 보장하는 최상의 매체가 아닐 수 있다는 매우 합리적인 지적을 했습니다. 

CSS가 이전에 JavaScript를 통해 처리된 것을 인수하면 일반적으로 브라우저가 로드해야 하는 코드의 양을 줄여주기 때문에 일반적으로 좋은 것으로 간주됩니다. 그래서 저는 CSS 토글에 대해 조심스럽게 낙관하며 CSS Working Group이 커뮤니티의 우려 사항을 적절하게 해결할 것이라고 믿습니다. 그러나 CSS가 국경을 넘어 확장되고 HTML과 자바스크립트의 책임을 잠식할 수 있다는 걱정을 하게 되는 날이 올지도 모릅니다.

새로운 기대

그리고 아마도 이것은 변경해야 할 사항입니다. CSS 개발자가 알아야 할 기대를 버려야 할 수도 있습니다. 모든 CSS의? 

이러한 기대는 CSS가 나중에 고려되었던 시절, 클라이언트가 요청한 것처럼 버튼을 파란색과 굵게 만드는 방법을 배워야 했던 성가신 구문에서 비롯됩니다. 그러나 오늘날의 CSS는 특히 다른 프론트 엔드 업무와 함께 한 사람이 마스터하기에는 너무 방대할 수 있다는 점을 받아들여야 한다고 생각합니다.

As 미셸 바커 그것을 박았 :

그리고 그것이 결국 나 자신이 착륙하는 곳입니다. 나는 아마도 모든 가능한 CSS 기능을 사용하지 않을 것입니다. 그리고 이것은 누군가로부터 온 것입니다. CSS에 대한 설문조사를 실행합니다.!

그러나 이러한 새로운 기능은 분명히 유용할 것입니다. someone. 누군가 그들에 대한 블로그 게시물을 작성하고 그들과 함께 멋진 CodePens를 만들고 그들에 대해 이야기할 것입니다. 그 사람은 여전히 ​​머리카락이 남아있는 멋지고 젊고 활기찬 개발자가 될 것입니다. 다시 말해서, 그것은 내가 아닐 것입니다. 그리고 그것은 괜찮습니다. 

그리고 이 새로운 개발자가 한 번에 배워야 하는 모든 내용에 압도될까봐 걱정할 수도 있습니다. 그러나 그들이 생각하는 모든 것을 염두에 두십시오. 습관 이러한 새로운 대안으로 대체되었기 때문에 정확히 알아야 합니다. 나는 언제든지 그 거래를 할 것이라는 것을 알고 있습니다.

하지만 생각해 보세요. 지난 몇 년 동안 우리는 처리해야 하는 기기의 수가 엄청나게 증가했을 뿐만 아니라 우리 모두가 웹을 약간 다른 방식으로 소비한다는 사실을 인식하기 시작했습니다. 장애, 현재 상황 또는 개인적인 선호도에. CSS는 이 새로운 현실에 적응해야 하지 않을까요?

이제, 이 모든 것이 나를 약간 그리워하게 만들었다고 고백해야 합니다... 그래서 내가 몇 개의 수레를 치우는 동안 실례합니다. 단지 옛날을 위해서입니다.


말씀드린대로 매년 CSS 설문조사 현황 지금 열려 있습니다. CSS가 너무 많다고 생각하든 그렇지 않든 설문조사는 브라우저 개발자에게 귀하의 기분을 알릴 수 있는 좋은 방법이므로 채우러 가 10분이 있다면. 

타임 스탬프 :

더보기 CSS 트릭