Co to jest rezonansowy przepływ pracy przy projektowaniu aplikacji internetowych?

9

Minęło trochę czasu, odkąd dokonałem jakiegokolwiek znaczącego rozwoju sieci i chciałbym skorzystać z najnowszych praktyk, ale staram się wizualizować przepływ pracy, aby uwzględnić wszystko.

Oto, czego chcę użyć:

  • Framework CakePHP
  • jsmin (JavaScript Minify)
  • SASS (Synctactically Awesome StyleSheets)
  • Git

CakePHP:

Dość zrozumiałe, wprowadzaj modyfikacje i aktualizuj źródło.

jsmin:

Po zmodyfikowaniu skryptu należy ręcznie uruchomić program jsmin, aby wygenerować nowy zminimalizowany kod, czy lepiej byłoby uruchomić przechwytywanie przed zatwierdzeniem, które automatycznie generuje wyniki jsmin zmienionych plików javascript. Załóżmy, że nie mam wiedzy na temat implementowania przechwytywania zmian.

SASS:

Bardzo podoba mi się to, co ma do zaoferowania SASS, ale zdaję sobie również sprawę, że kod SASS nie jest domyślnie obsługiwany przez przeglądarki, więc w pewnym momencie kod SASS musi zostać przekształcony w normalny CSS. W którym momencie przepływu pracy jest to wykonywane.

Git

Jestem przerażony przyznać się do tego, ale ostatnim razem, gdy dokonałem jakiegokolwiek znaczącego rozwoju sieci, nie użyłem kontroli źródła SCM (IE, użyłem kontroli źródła, ale składało się to z bardzo szczegółowego dziennika zmian z kopiami zapasowymi).

Od tego czasu mam duże doświadczenie w korzystaniu z Git (a także mercurial i SVN) do tworzenia desktopów, ale zastanawiam się, jak najlepiej wdrożyć to do programowania stron internetowych.

Czy powszechną praktyką jest wdrażanie zdalnego repozytorium na hoście internetowym, dzięki czemu mogę przekazywać zmiany bezpośrednio do serwera produkcyjnego, czy też istnieje narzędzie wieloplatformowe (Windows / Linux), które ułatwia przesyłanie tylko zmienionych plików na serwer produkcyjny . Czy istnieją firmy hostingowe, które ułatwiają wdrożenie zdalnego repozytorium, czy potrzebuję dostępu SSH itp.

Wiem, jak to zrobić na własnym serwerze testowym ze zdalnym repozytorium z oddzielną gałęzią zdalnego śledzenia, ale nigdy wcześniej nie robiłem tego na zdalnym produkcyjnym serwerze hostingowym, więc nie znam jeszcze opcji.

Dodatkowy:

Zastanawiałem się nad wdrożeniem frameworka javascript, w którym osobne pliki javascript używane na stronie są kompilowane w jeden plik dla każdej strony na serwerze produkcyjnym, aby ograniczyć liczbę wymaganych plików do pobrania na stronę.

Czy coś takiego już istnieje? Czy istnieje już na wolności projekt open source, który implementuje coś podobnego, z czego mógłbym skorzystać i do którego mogę się przyczynić?

Biorąc pod uwagę, jak paranoiczni twórcy stron internetowych odnoszą się do wydajności (oraz fakt, że liczba żądań plików na stronie internetowej jest dużym hitem wydajności), zgaduję, że w sieci jest jakiś haker-czarodziej, który już rozwiązał ten problem.

Evan Plaice
źródło

Odpowiedzi:

2

Możesz sprawdzić rozszerzenie Google PageSpeed ​​dla Apache : afaik, istnieje możliwość automatycznego agregowania i minimalizowania Javascript i CSS w połączeniu z buforowaniem, to pasuje do tego, o czym wspominasz, którego szukasz na końcu swojego postu.

dzikie piki
źródło
1
Fajnie, nie zdawałem sobie sprawy, że to wszystko można zrobić za pomocą jednego modułu Apache. Minimalizacja Javascript / css, konkatenacja javascript / css, a także kilka innych opcjonalnych ulepszeń wydajności. Po pewnym Googlingu dowiedziałem się nawet, że Dreamhost zapewnia mu hosting współdzielony / VPN. Dziwi mnie, że nie ma więcej informacji na ten temat na stronach webmasters.stackexchange.com lub stackoverflow.com.
Evan Plaice,
5

jsmin

Jeśli nie masz dużo JS, możesz ustawić coś, co zminimalizuje za każdym razem, gdy klikniesz save. Jeśli masz dużo JS, włącz go do procesu wdrażania (zobacz Git poniżej).

SASS

Użyj Compass Framework . Zawiera SASS, a także mały skrypt, który „obserwuje” Twój katalog SASS i kompiluje pliki do CSS (w tym zminimalizowanego CSS, jeśli chcesz) za każdym razem, gdy zapisujesz. Jest zbudowany z myślą o RoR, ale można go łatwo używać z dowolną strukturą internetową, tworząc plik konfiguracyjny kompasu i uruchamiając polecenie „obserwuj kompas”. Kompas zawiera również wiele innych przydatnych narzędzi, takich jak Blueprint , przydatne miksy i automatyczne generowanie duszków za pomocą wtyczki Lemonade (która powinna zostać wbudowana w Compass w następnej wersji ).

Git

W zależności od wielkości / złożoności witryny, rozważ wykonanie Capistranomodel wdrażania. Nie jestem pewien, czy możesz używać Capistrano bezpośrednio z CakePHP, ale sedno jest następujące: każdy serwer produkcyjny ma „bieżący” folder, który zawiera cały kod, który jest uruchomiony w produkcji w tym momencie. Za każdym razem, gdy chcesz wdrożyć nowy kod, uruchamiasz skrypt, który ssh jest na każdym serwerze produkcyjnym i ma go (a) skopiować zawartość „bieżącego” folderu do folderu kopii zapasowej (z nazwą wydania / znacznikiem czasu), ( b) sprawdź najnowszy kod z Git w folderze „bieżącym” i (c) zacznij udostępniać ten nowy kod z folderu „bieżącego”. W ten sposób możesz w razie potrzeby przywrócić poprzednią wersję i dokładnie powiedzieć, która wersja jest w produkcji. Capistrano pozwala także dodawać różnego rodzaju zadania niestandardowe w ramach procesu wdrażania, w tym minifaction JS / CSS,

Dodatkowy

Tak, jest kilka. Google za coś takiego jak „CSS / JS concat”. Oto szybki, który znalazłem dla CakePHP: Asset Packer .

Jewgienij Brikman
źródło
Wielkie dzięki za wkład. Naprawdę podoba mi się to, co zobaczyłem w Compass Framework. Chciałbym tylko wiedzieć, jak mogę wdrożyć go w PHP. Przeszukiwałem Internet, ale nie mogę znaleźć alternatywy. Capistrano również wygląda bardzo interesująco, ale zamiast drogiego i delikatnego modelu kopiowania plików użyłem tylko ssh, aby powiedzieć klientowi git na wszystkich zdalnych serwerach, aby wykonał szybkie „ściągnięcie git -rebase” po sprawdzeniu, czy zadziałało podczas testowania pierwszy serwer.
Evan Plaice,
(ciąg dalszy) Pakiet zasobów również wygląda bardzo interesująco. Jedynym powodem, dla którego wybrałem inną odpowiedź niż twoją, było to, że zawierała wszystko w jednym ujęciu, a przetwarzanie odbywało się na samym serwerze (więc nie są potrzebne żadne dodatkowe skrypty). Jedynym minusem, który widzę w pagepeed, jest dodatkowe przetwarzanie zawartości statycznej (którą można łatwo rozwiązać za pomocą buforowania zawartości statycznej i / lub CDN. Naprawdę chciałbym zaakceptować 2, ponieważ twoja odpowiedź zawiera wiele cennych informacji.
Evan Plaice,
Nie „wdrażasz” frameworku Compass za pomocą PHP. Po prostu uruchamiasz go podczas pisania kodu, kompiluje on pliki CSS za każdym razem, gdy naciskasz save, a pliki CSS są tym, co faktycznie jest wdrażane. Aby „uruchomić” kompas, musisz najpierw wygenerować plik konfiguracyjny (compass.rb) - użyj go do wygenerowania opcji wiersza poleceń: jsfiddle.net/chriseppstein/PG46q/3 . Kiedy już skonfigurujesz plik konfiguracyjny ze wszystkimi ścieżkami, po prostu uruchom „zegarek kompasu” w tym samym folderze, co plik konfiguracyjny, a kompas rozpocznie kompilację SASS za każdym razem, gdy klikniesz Zapisz. Wypróbuj przy jakimś pobocznym projekcie: jest to BARDZO łatwe i szybkie.
Jewgienij Brikman,
Ponadto, o ile mi wiadomo, Capistrano nie kopiuje zbyt wiele. Przy każdym wdrożeniu sprawdza najnowszy kod i po prostu zamienia nazwy folderów. Zaletą jest to, że zawsze możesz przywrócić wcześniejszą wersję, po prostu ponownie zamieniając nazwy folderów.
Jewgienij Brikman,
Znalazłem artykuł o tym, jak uruchomić go w PHP. Łatwiej jest go używać poza projektem Ruby, niż się spodziewałem. Podrap mój ostatni komentarz na temat Capistrano. Myślałem, że został użyty do wysłania rozproszonego polecenia do wielu serwerów. Jeśli mam dostęp ssh do zdalnych serwerów, wolałbym porzucić klienta git jako sposób na pobranie najnowszych zmian z branży produkcyjnej. IMHO, wymiana folderów to zły pomysł. Wolałbym oznaczać wersje tagami w cyklu wydania i po prostu sprawdzić poprzedni tag, jeśli bieżący ma problemy.
Evan Plaice,