Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Mały skrypt JS + JQuery - pytanie.
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
dawidryba
Witam serdecznie,
Jako, że z JS dopiero zaczynam to nie bardzo wiem, czy coś takiego da się zrobić. Napisałem bardzo łatwy, mały skrypy, który odpowiada za "przyklejenie" menu na górze przeglądarki. Dany skrypt korzysta z biblioteki JQuery. Pobrałem bibliotekę z internetu i okazało się, że warzy ona ponad 200kb (trochę dużo). Bardzo zależy mi na optymalizacji mojej strony. Przepuściłem dany plik przez compresor JS i wyszło 130kb.

Nurtuje mnie pewna sprawa. Czy biblioteka JQuery musi być aż tak obszerna dla tak małego skryptu? Może znajdują się tam jakieś niepotrzebne funkcje? Orientujecie się może?

  1. <script type='text/javascript'>
  2. $(window).load(function(){
  3. function fixDiv() {
  4. var $cache = $('#menufixed');
  5. var $caches = $('#moremargin');
  6. if ($(window).scrollTop() > 113)
  7. {
  8. $cache.css({'position': 'fixed', 'top': '0','max-width': '100%','width': '100%'});
  9. $caches.css({'margin-top': '40px'});
  10. }
  11. else
  12. {
  13. $cache.css({'position': 'relative', 'top': 'auto','max-width': '1130px'});
  14. $caches.css({'margin-top': '0px'});
  15. }
  16. }
  17. $(window).scroll(fixDiv);
  18. fixDiv();
  19. });
  20. </script>


2 sprawa, czy ktoś ma doświadczenie dotyczące blokowania renderowania strony na Joomla! przez JS?

Z góry dziękuję za poświęcony czas na odpisanie mi.
Pozdrawiam Dawid Rybacki!

viking
Bez jquery http://www.cssscript.com/simple-on-demand-...-headhesive-js/
Jeżeli chcesz to możesz zbudować jQuery z komponentów które potrzebujesz co ograniczy rozmiar. https://github.com/jquery/jquery W dokumentacji masz opisane moduły.

2 sprawy nie rozumiem o co chodzi
Crozin
Tak swoją drogą skompresowane (minifikacja + gzip) jQuery waży 34 KiB.
Comandeer
I tak za dużo na coś, co da się machnąć 3 linijkami JS wink.gif jak nie trzeba wspierać IE, to IMO jQuery lepiej zostawić w spokoju

Warto też zrobić feature detection, bo lisek i webkit mają coś takiego natywnie: position: sticky
trueblue
Cytat(Comandeer @ 27.08.2015, 09:57:45 ) *
Warto też zrobić feature detection, bo lisek i webkit mają coś takiego natywnie: position: sticky

Po włączeniu odpowiednich flag w konfiguracji. A w Chrome przestali wspierać: http://src.chromium.org/viewvc/blink?view=...revision=177128
Comandeer
Hmm… Zgodnie z http://caniuse.com/#feat=css-sticky w lisku działa out-of-box, a w Webkicie potrzebuje prefiksu -webkit
dawidryba
Tak też myślałem, żeby w jakiś sposób odchudzić JQuery. Jednak jestem zielony w JS i nie bardzo wiem jakich funkcji on używa.
scroll() i scrollTOP() są tymi funkcjami? Jak na podanym linku przez Vikinga odnaleźć te funkcje i stworzyć z nich mały JS? smile.gif

Niestety muszę wspierać IE. ok 20% odwiedzających korzysta z IE.

Przepraszam za moją udolność.




Cytat(viking @ 27.08.2015, 08:37:11 ) *
Bez jquery http://www.cssscript.com/simple-on-demand-...-headhesive-js/
Jeżeli chcesz to możesz zbudować jQuery z komponentów które potrzebujesz co ograniczy rozmiar. https://github.com/jquery/jquery W dokumentacji masz opisane moduły.

2 sprawy nie rozumiem o co chodzi
viking
W tym podanym linku plik js ma 4kb bez gzipa i zawiera wszytsko co potrzebujesz. MOżna poszukać oczywiście innej biblioteki ale zależy czy chcesz wspierać starsze przeglądarki.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.