CSS: Problemy z CSSem

0:00W tej lekcji z kursu zaawansowane techniki

0:02CSS będziemy mówili o problemach co czasem można to podzielić na kilka punktów.

0:09Generalnie CSS jest trudny można z nim faktycznie szybko zacząć pracować.

0:13Nie jest jego ciężko nauczyć.

0:15Jako że ma dosyć składnia intuicyjna mamy nazwy właściwości jakby grał czyli z

0:21angielskiego po prostu to wartość na przykład red.

0:25Czyli kolor to jest ta intuicyjna część CSS.

0:28Natomiast ma on niestety swoje problemy

0:31zwłaszcza jeżeli chodzi o skanowanie czy generalnie zarządzanie nim

0:36przez nas deweloperów a i sam język też ma niestety swoje pułapki.

0:41W związku z czym. Jakie są np.

0:43problemy samego CSS.

0:45Jak wspomniałem jest on dosyć prosty do

0:47nauczenia się ze względu na to że jest dosyć jawny.

0:51Opisujemy jaką właściwość chcemy zmienić na jaką wartość.

0:55No i to się faktycznie dzieje w większości przypadków.

0:58Gorzej jeżeli faktycznie już zaczynamy z

1:01tym jest czasem pracować tworzyć nasze strony nasze strony rosną no to wtedy.

1:06Mechanizmy takie jak kaskada dziedziczenie czy specyficzne elektorów

1:12mogą być problematyczne jeżeli faktycznie nie rozumiemy ich tylko po prostu

1:17zaczęliśmy hodować CSS a no bo całkiem prosty język wydaje się

1:22natomiast te mechanizmy są właśnie dosyć skomplikowane.

1:26O tych mechanizmach będziemy oczywiście mówili w tym kursie

1:29i jest on dosyć luźny to znaczy że nie mamy dobrej kontroli nad nim.

1:34Nie ma czegoś takiego jak na przykład stricte CSS.

1:38Jeżeli zrobimy jakiś błąd wcale postawimy

1:41gdzieś ile średnich po prostu stworzymy tzw.

1:45zero czyli błąd dniowy.

1:47Nie będzie to łatwe.

1:49Nie ma jakby żadnego domyślne kompilator

1:52dla CSS a który nam faktycznie powie że na linii C 73 jest błąd i generalnie ten błąd

1:59powoduje problemy z naszym autem że coś nam źle skończyło.

2:04Oczywiście są do tego narzędzia które my jako społeczność stworzyliśmy żeby łatwiej

2:09pracować z sensem ale sam język w sobie takich mechanizmów nam nie dostarcza.

2:14Co wiąże się właśnie z tymi problemami ze skalą.

2:17Nie musimy tutaj tworzyć wielkich serwisów wielkich koncernów które będą obsługiwały

2:23setki tysięcy klientów aby doświadczyć tych problemów.

2:26Przede wszystkim dlatego że CSS jest ogromnym drzewem zależności.

2:31Jeżeli będziemy ładowarki plik a

2:34do naszego HTML a i plik B będzie konflikt np.

2:38klas czy po prostu elektorów prostych takich jak DVI wszystkie trzy czy

2:43wszystkie impulsy no to CSS musi sobie jakoś z tym poradzić

2:47ponieważ cały ten kod źródłowy jest naraz interpretowany przez przeglądarkę nie ma

2:52czegoś takiego jak skopiowane CSS czyli kapitulacja tego kodu nie jest możliwa.

2:59Domyślnie w samym CSS oczywiście

3:01są do tego narzędzia ale koniec końców tak czy siak cały.

3:07CSS Object Model jest skomplikowany jako

3:09całość w związku z czym mogą zdarzyć się sytuacje że zmieniamy

3:15jedną wartość jednego elektora no i niestety element w naszym drzewie którego

3:20byśmy się nie spodziewali też ulega zmianie.

3:23To oczywiście jest błędem jest Bogiem

3:25który my musimy ręcznie odnajdywać i naprawiać jako deweloperzy.

3:31Do tego dochodzą niespójności w implementacji.

3:33Na pewno jeżeli zajmowały się CSS em w przeszłości no to jakby praca nad

3:40kilkoma środowiskami w tym wypadku przeglądarki

3:44Opera Internet Explorer Firefox com było tego jeszcze oczywiście więcej potrafiły

3:50być naprawdę duże i jeżeli coś wyglądało dobrze na Krymie zupełnie nie znaczyło że

3:55nasz auto jest kompletny ponieważ problemy z CSS em były na tyle

3:59szerokie w kontekście samej implementacji przez przeglądarki po prostu były banki

4:04które musieliśmy ręcznie jakoś obchodzić i tworzyć markę Randy

4:08czy używać tak naprawdę właściwości CSS owych niezgodnie z ich przeznaczeniem bo

4:14po prostu CSS nie był jeszcze na tyle dojrzałym językiem żeby.

4:18Pozwolić nam osiągnąć niektóre efekty.

4:22Błędy specyfikacji tak naprawdę miałem tutaj na myśli.

4:26Nie mniej intuicyjne niektórych rozwiązań

4:28w specyfikacji ponieważ część właściwości może wyglądać

4:32jak funkcja może być rozdzielona przez przecinka albo przez stację.

4:38Nie ma tutaj jak ciężko się odnaleźć po prostu w kodzie

4:42która właściwość ma jaki synteza jaką ma składnia.

4:45Zwłaszcza że przeglądarki tak naprawdę mogą komplementował własne rozwiązania

4:50które dopiero później wejdą do specyfikacji.

4:52Do tego dochodzą problemy nasze

4:54deweloperów czyli po prostu brak dokumentacji.

4:57I tutaj nie mówię już konkretnie o

4:59dokumentach CSS a lecz bardziej dokumentację naszych projektów.

5:04Często jest tak że każdy z nas może edytować CSS a to znaczy

5:10my deweloperzy kontra aktorzy których faktycznie nasza

5:14firma zatrudnia jako dodatkową siłę roboczą która po prostu będzie nasze.

5:19Landing page edytor działa w sposób szybki

5:23czy nawet designer czy edytor treści.

5:26Również często mają dostęp do CSS a czy to lawinowo czy nie lawinowo.

5:31W związku z czym CSS bardzo łatwo może się posypać jak domek z kart.

5:37Do tego dochodzi komunikacja taka że

5:38często nie chcemy rozumieć całego naszego kodu źródłowego CSS

5:43lecz bardziej podchodzimy do tego muszę dodać nowy komponent.

5:47Ok więc dodam na koniec mojego pliku źródłowego HTML

5:51nowy arkusz Stelli z którymi ja będę pracował ja je będę rozumiał i one będą

5:57oczywiście czystsze niż ten kod który był tam już wcześniej.

6:00Jeżeli przez projekt przedziera się kilku

6:04deweloperów i każde z nich zrobi takie podejście no to projekt po prostu ma

6:0910 20 różnych podejść gdzie każdy pisze te style inaczej i jakby nie ma tutaj tego

6:16wspólnego języka jakiejś hali jakiejś klasy czy klasy pomocniczych.

6:24No i do tego dochodzi właśnie to że CSS jest pozornie prosty więc mamy tutaj chęć.

6:32Manipulacji tego co przez każdego.

6:36Oczywiście jeżeli nie znamy tych

6:38mechanizmów no to to się często źle kończy.

6:41Jakie są rozwiązania tych problemów.

6:44Przede wszystkim my jako społeczność

6:45stworzyliśmy różne architektury i metodologię CSS a.

6:49Są Atomic fajne są be my są SE.

6:55Mamy procesory języków takie jak SAS czy.

7:00Les Bleus możemy zrozumieć te mechanizmy

7:03języka o których już wspomniałem wcześniej czyli.

7:06Kaskada dziedziczenie i specyficzna w ten sposób możemy faktycznie mniej narażać się

7:12na te niepewne grunty CSS a i przede wszystkim korzystać z dobrych

7:16praktyk są pewne patenty które też my wypracowaliśmy sobie.

7:22Jakich właściwości unikać żeby nie mieć problemów z wydajnością naszego kodu.

7:26Jakich problemów unikać żeby nasz klejnot

7:29nie rozpada się jak wspomniany wcześniej domek z kart.

7:32I o tym wszystkim postaram się opowiedzieć w tym kursie a przynajmniej skierować cię

7:36na dobrą drogę i wskazać dodatkowe źródła których będziesz mógł korzystać na własną

7:41rękę gdy faktycznie będziesz tworzył swoje własne projekty.

7:46Tak więc tyle teorii przejdziemy do

7:48praktyki i tłumaczenia faktycznych mechanizmów CSS a w następnej lekcji.