Jestem przede wszystkim programistą PHP, ale ostatnio grałem z wieloma skryptami JavaScript, głównie w jQuery.Jak organizować kod JavaScript w projekcie pod kątem łatwości konserwacji?
Problem polega na tym, że kod staje się trudniejszy do debugowania, a to utrudniło, ponieważ mam programy nasłuchujące zdarzeń w całym kodzie HTML.
Kod obsługuje wywoływanie AJAX i manipulowanie DOM.
Oznacza to masz trzy rodzaje plików, HTML, CSS i JS.
Nie miesza się żadnego kodu HTML, CSS ani JS. Każdy z nich znajduje się w osobnym pliku.
Jedynie dzięki zachowaniu wszystkiego oddzielnie i nigdy nie używając za pomocą wbudowanego javascript lub wbudowanego CSS, możesz rozwiązać większość problemów związanych z organizacją kodu.
Inną techniką są pakery i minifigi.
Moi packagers z wyboru są browserify (js) i less (CSS)
Packagers znaczy, trzeba cały swój kod w wielu plików/modułów rozbiciu dobrego projektu. Następnie, ponieważ wysyłanie wielu małych plików jest drogie, używasz pakowarki czasu kompilacji, aby przekształcić wszystkie twoje js w jeden plik js, a wszystkie twoje css w jeden plik css.
Co do samego JS, mam tendencję do pójścia dalej i korzystania z modułu ładującego. Browserify jest zarówno narzędziem pakującym, jak i modułem ładującym.
Ładowarki modułów oznaczają, że definiujesz małe moduły i ładujesz/wymagają ich, kiedy potrzebujesz i gdzie chcesz.
Implementuję również architekturę opartą na zdarzeniach i wzór mediator, aby zachować luźno powiązany kod. Można pójść dalej i wdrożyć coś takiego, jak blackboard system, ale nie próbowałem tego osobiście.
Tak, to co obserwuję, chociaż mam tendencję do włączenia bezpośredniego html do w razie potrzeby plik php. –
@ ProjectV1 Nie mogę mówić za PHP, ale instynkt gut to taka zła praktyka. – Raynos
Tak to jest i może nie powinienem zacząć pisać kilku wskazówek. –
Można rozważyć użycie CommonJS "require" w celu oddzielenia kodu javascript w wielu plikach, a następnie użyć browserify lub Webpack. Inną opcją jest Cor, który jest językiem, który kompiluje do javascript koncentruje się na organizacji, czystości i doświadczeniu programistycznym.
1) Nie wkładaj wbudowanych programów obsługi zdarzeń – William
@Lime mam również problemy ze zwykłym javascript nie działa przed $ (document) .ready() – MrFoh