Gra Hydraulik (Plumber) (jQery)

Question

Witam,

Stworzyłem popularną gierkę typu Hydraulik (Plumber) polegającą na układaniu rur i doprowadzeniu wody. Zasady i opis na stronie. Kod pisałem 1 raz w jQery (używa się go jeszcze?). Gra zawiera (na razie) 4 poziomy. Link:

 

http://hydraulik-game.opx.pl/

 

Zapraszam do zagrania, komentowania, oceny, co można poprawić itd.

Pozdrawiam :)

Answer 1

JQuery już raczej nie ;) Ma sporo wad (https://www.youtube.com/watch?v=JoUrZlcdoFw)

Sama gra jest bardzo fajna, ale to co ci polecam, takie rzecz. 

1) Do takich gier gdzie używasz tylko jednej strony konfiguracja Webpacka to bułka z masłem. Więc zainteresuj się tym tematem. Dzięki temu twój kod będzie zminifikowany a ty jako programista będziesz miał do dyspozycji wiele ciekawych rzeczy.

2) Skrypty umieszczaj pod koniec body a nie head. Dzięki temu strona załaduje się szybciej

3) Takie rzeczy najlepiej robić w elemencie canvas, a nie elementach html. Zainteresuj się canvasem to zobaczysz ile wad ma robienie tego w taki sposób

4) Widzę że używasz jakiegoś darmowego hostingu. Ok, ale masz przez to reklamy. Możesz używać darmowych rozwiązań, np Google Firebase, Netlify

5) Gdzieś w kodzie masz coś takiego:

onclick="reset_game()"

Jest to zła praktyka. Powinieneś użyć

document.querySelector('#your-button').addEventListener('click', () => {
    // to będzie wykonane po kliknięciu przycisku
});

albo z użyciem JQuery

$('#your-button').on('click', () => {
    // To będzie wykonane po kliknięciu przycisku
});

Wiem że trochę tego dużo, no ale cóż ;)

Comments

Kto dał -1? ;) I najważniejsze za co?

---

@Milesq, dałem 1+ dla wyrównania, nie mam pojęcia kto mógł Ci dać minusa. Wielkie dzięki za rady, im więcej tym lepiej :) właśnie z tego filmiku co wysłałeś słyszałem, że jquery jest już przestarzały po ECMA6, ale mimo to chciałem tę bibliotekę wypróbować i jest na prawdę przyjemna :p o canvasie słyszałem, lecz jeszcze nie zagłębiałem się w niego i w animacje, ale to zrobię :) co do webpacka to dzięki za info bo nie słyszałem o tym w sumie, a skrypty faktycznie gdzieś obiło mi się o uszy żeby umieszczać na dole ale skądś mam te złe przyzwyczajenie. Wielkie dzięki za wszystkie rady. Pozdrawiam :) 

Answer 2

Własnie chyba przez te "onclicki" w HTMLu zamiast w JS nie wszystkie dźwięki są odtwarzane prawidłowo w Operze i Mozilli (w Mozilli dodatkowo w wielu miejscach nie działa obracanie rur, również są na onclicku). W Chromie dobrze działa, bo na nim go testowałem od początku :)

Moje przypuszczenia co do nieprawidłowego działania w innych przeglądarkach przez "onclick" są trafne? Ktoś potwierdzi?