GoldenLine
Zaloguj się
Artur Bilski

Artur Bilski Ruby on Rails &
Javascript Developer

Temat: artJs

Witam wszystkich,

Ostatnio stworzyłem niewielki framework JS.

http://artjs.org

Gdyby ktoś miał ochotę wypróbować, chętnie wysłucham jakichkolwiek uwag.
Nastawiony jest głównie na możliwość jego dalszej rozbudowy i dlatego kod może wyglądać nieco klasycznie. Silnie wykorzystuję OOP i dlatego użycie go nie jest podobne do np. jQuery, gdzie często występuje funkcja w funkcji w funkcji w funkcji :) Skłania raczej do bardziej płaskiego stylu programowania.
Sam framework nie jest jednym plikiem dla wszystkich przeglądarek, lecz odpowiednia wersja jest doczytywana po załadowaniu głównego małego pliku "art.js". Zależałoby mi głównie aby ktoś spróbował go użyć i powiedział co jest w nim nieintuicyjne, czego brakuje w dokumentacji lub co jego zdaniem jest wykonane po prostu źle :) no i ewentualne bugi rzecz jasna.
Do szybkiego potestowania można użyć firebuga na stronie dokumentacji która używa tego frameworka ;)Artur Bilski edytował(a) ten post dnia 09.07.10 o godzinie 21:50
Link do wypowiedziLink

konto usunięte

Temat: artJs

Szybkie pytanie.

Czemu nie sforkowales jQuery i nie dorobiles tego,czego tam brakuje ?
Link do wypowiedziLink
Artur Bilski

Artur Bilski Ruby on Rails &
Javascript Developer

Temat: artJs

Nie chodziło mi o dopisanie funkcjonalności do istniejących frameworków bo czegoś mi w nich brakowało, ale o napisanie swojego w swoim stylu kodowania ;)Artur Bilski edytował(a) ten post dnia 10.07.10 o godzinie 16:05
Link do wypowiedziLink

konto usunięte

Temat: artJs

Artur Bilski:
Nie chodziło mi o dopisanie funkcjonalności to istniejących frameworków bo czegoś mi w nich brakowało, ale o napisanie

do dołączasz się do jednego z istniejących i dopisujesz to, czego brak...
swojego w swoim stylu kodowania ;)

"swojego" które zrozumiesz tylko Ty? ale po co? mało tego jest w necie?

edit: a co do "jQuery, gdzie często występuje funkcja w funkcji w funkcji w funkcji" to chyba jednak słabo poznałeś jQuery...Piotr Lewandowski edytował(a) ten post dnia 10.07.10 o godzinie 15:25
Link do wypowiedziLink
Artur Bilski

Artur Bilski Ruby on Rails &
Javascript Developer

Temat: artJs

Piotr Lewandowski:
Artur Bilski:
Nie chodziło mi o dopisanie funkcjonalności do istniejących frameworków bo czegoś mi w nich brakowało, ale o napisanie

do dołączasz się do jednego z istniejących i dopisujesz to, czego brak...

Napisałeś dokładnie odwrotną poradę do tego co zacytowałeś :)
swojego w swoim stylu kodowania ;)

"swojego" które zrozumiesz tylko Ty? ale po co? mało tego jest w necie?

Nie, wydaje mi się że kod jest czytelny dla każdego.

edit: a co do "jQuery, gdzie często występuje funkcja w funkcji w funkcji w funkcji" to chyba jednak słabo poznałeś

Dobrze poznałem.
Chodzi mi bardziej o zalecany sposób użycia - przykład ze strony jQ:


$(document).ready(function() {

   // use this to reset several forms at once

   $("#reset").click(function() {

     $("form").each(function() {

       this.reset();

     });

   });

 });


Za każdym klikiem uruchamiana jest maszyneria do wyszukania $("form") oraz tworzone jest n nowych kopii funkcji wewnętrznej (n - ilość formularzy). Można to napisać lepiej ale w dokumentacji tak stoi i nikt tego nie robi.

Sam kod biblioteki jQ też niezbyt mi odpowiada. 50% kodu to 'if' lub 'for'
Wydaje mi się że sporo funkcjonalności się powtarza i wszystkie klasy zbyt słabo wykorzystują wzajemnie swoje możliwości.Artur Bilski edytował(a) ten post dnia 11.07.10 o godzinie 15:21
Link do wypowiedziLink
Marek Pawłowski

Marek Pawłowski Trener
Javascript/Senior
developer

Temat: artJs

Hehe ja bym tak mocno nie krytykowal ;)
Zreszta na pytanie po co jest wiele dobrych odp. np. jak sama nazwa wskazuje dla sztuki xD

Mi osobiscie bardzo sie podobaja takie inicjatywy chocby dlatego ze można poznać podejście/koncepcje innych.

Na starcie nie spodobalo mi sie:

art.js:9 document.write('<script src="' + ArtJs_path + 'art.' + ArtJs_package + '.js" type="text/javascript"></script>');

mozna by zrobić to async dodajac dynamicznie element script do heada. Znacznie ladniejsze podejscie nie blokujace strony. Można by nie wgrywać wszystkiego naraz tylko porobić moduly na wzór YUI ;)

Jak bede miał chwile po grillu to zrobie jeszze jakies review poszegolnych obiektów.
Link do wypowiedziLink
Artur Bilski

Artur Bilski Ruby on Rails &
Javascript Developer

Temat: artJs

@Marek: Bardzo Ci dziękuję :)
Przemyślę tą poprawkę z sekcją head.
Co do modułów to myślałem o tym ale ten framework nie jest taki ciężki a roboty przy żonglowaniu odpowiednimi byłoby trochę :)
No chyba że cały framework rozrośnie się do 1MB :|Artur Bilski edytował(a) ten post dnia 10.07.10 o godzinie 16:10
Link do wypowiedziLink

konto usunięte

Temat: artJs

Artur Bilski:
Piotr Lewandowski:
Artur Bilski:
Nie chodziło mi o dopisanie funkcjonalności do istniejących frameworków bo czegoś mi w nich brakowało, ale o napisanie

do dołączasz się do jednego z istniejących i dopisujesz to, czego brak...

Napisałeś dokładnie odwrotną poradę do tego co zacytaowałeś :)

Hehe :D Racja, źle przyczytałem... :D TO od tego gorąca... dobrze, że w biurze klima działa...
Link do wypowiedziLink
Maciej Aniserowicz

Maciej Aniserowicz software
developer/architect

Temat: artJs

Artur Bilski:
Do szybkiego potestowania można użyć firebuga na stronie dokumentacji która używa tego frameworka ;)

Wszedłem z Opery (10.54) i nic mi nie działa, więc pierwsza uwaga która się nasuwa: artJS nie jest cross-browser a to raczej kluczowe wymaganie dla takiej biblioteki:).
Link do wypowiedziLink

konto usunięte

Temat: artJs

Maciej Aniserowicz:
Artur Bilski:
Do szybkiego potestowania można użyć firebuga na stronie dokumentacji która używa tego frameworka ;)

Wszedłem z Opery (10.54) i nic mi nie działa, więc pierwsza uwaga która się nasuwa: artJS nie jest cross-browser a to raczej kluczowe wymaganie dla takiej biblioteki:).
U mnie też nie zadziałało. Więc spojrzałem w źródło biblioteki i jak dla mnie to małe nieporozumienie:

var ArtJs_version = {};



ArtJs_version['Microsoft Internet Explorer'] = 'ie';

ArtJs_version['Netscape'] = 'ff';



var ArtJs_package = ArtJs_version[navigator.appName];

var ArtJs_path = ArtJs_path || 'javascripts/';



document.write('<script src="' + ArtJs_path + 'art.' + ArtJs_package + '.js" type="text/javascript"></script>');

Rozumiem, że przeglądarki mają swoje specyfikacje i trzeba stosować multum różnych rozwiązań i hacków (od czego są w dużej mierze biblioteki typu jQuery, Prototype). Wiadomo, że obsługa zdarzeń czy drzewa DOM w różnych przeglądarkach jest okropna i strasznie różna.

Ale żeby od razu wydzielać różne biblioteki dla różnych przeglądarek? Mamy Operę, IE, Mozille, Safari, Konqueror, Google Chrome. Czy inne wynalazki typu SeaMonkey, Maxthon, Avant Browser, Enigma Browser. Teraz będzie trzeba dla każdej po kolei napisać bibliotekę wzorującą na pliku bazowym - nieźle :-) A może jeszcze zrobić osobne biblioteki dla różnych systemów? Pewnie też znajdzie się wiele różnic dla różnych systemów, nie mówiąc już o różnych wersjach przeglądarek.
Link do wypowiedziLink
Artur Bilski

Artur Bilski Ruby on Rails &
Javascript Developer

Temat: artJs

Maciej Aniserowicz:
Artur Bilski:
Do szybkiego potestowania można użyć firebuga na stronie dokumentacji która używa tego frameworka ;)

Wszedłem z Opery (10.54) i nic mi nie działa, więc pierwsza uwaga która się nasuwa: artJS nie jest cross-browser a to raczej kluczowe wymaganie dla takiej biblioteki:).
http://artjs.org/
"Currently it supports FF, Chrome, Safari and IE8."

Po kolei ;)
Kamil Brenk:
Ale żeby od razu wydzielać różne biblioteki dla różnych przeglądarek?

A czemu nie? używając GITa i trzymając wersje jako różne branche rozwój takiego frameworka jest dużo łatwiejszy.
Na razie dodam jeszcze wersje dla Opery oraz IE7.
Pisanie pod przeglądarki które mają 10^-5% użytkowników nie jest chyba warte zachodu.
Link do wypowiedziLink

konto usunięte

Temat: artJs

Artur Bilski:
Maciej Aniserowicz:
Artur Bilski:
Do szybkiego potestowania można użyć firebuga na stronie dokumentacji która używa tego frameworka ;)

Wszedłem z Opery (10.54) i nic mi nie działa, więc pierwsza uwaga która się nasuwa: artJS nie jest cross-browser a to raczej kluczowe wymaganie dla takiej biblioteki:).
http://artjs.org/
"Currently it supports FF, Chrome, Safari and IE8."

Po kolei ;)
Kamil Brenk:
Ale żeby od razu wydzielać różne biblioteki dla różnych przeglądarek?

A czemu nie? używając GITa i trzymając wersje jako różne branche rozwój takiego frameworka jest dużo łatwiejszy.
Na razie dodam jeszcze wersje dla Opery oraz IE7.
Pisanie pod przeglądarki które mają 10^-5% użytkowników nie jest chyba warte zachodu.
Jest warte zachodu. Użytkownik = pieniądz, więc im więcej ich obsłużysz tym więcej zarobisz :-)
Link do wypowiedziLink
Marek Pawłowski

Marek Pawłowski Trener
Javascript/Senior
developer

Temat: artJs

Tutaj Kamil zwrócił słusznie uwage że dużo lepszym rozwiązaniem jest feature detection niż browser detection.

1). dlatego iż featury w wiekszosci "Normalnych" przegladarek dzialaja identycznie.

2). dlatego ze nie trzeba sie martwić o wykrycie z jaka przegladarką mamy doczynienia. ;)

3). kod jest zgrupowany logicznie (kod dotyczacy kazdej funkcjonalności jest w jednym miejscu i nie musisz szukac po dziesieciu plikach i zastanawiac sie dlaczego zly plik sie wgral etc.)

Przydały by sie unit testy. (i tu kolejna rzecz ktora można by dorobić tak zeby trzymac sie zalożeia self made: framework do unit testów)

a co do % to łatwo sobie przemnożyć % x ~15 mln. użytkowników w polsce czyli odcinasz 150 tys. userów per 1%. Wybór targetu jest kluczowym elementem kazdego projektu. A w przypadku frameworka js sprowadza sie do tego ze musisz wspierać wszystkie przegladarki jakie tylko sie da (no moze oprocz ie6 (IE6 MUST DIE!)) bo takie jest zalozenie frameworka. Ludzie używaja frameworków zeby sie nie martwić o crossbrowser compatibility.
Link do wypowiedziLink
Artur Bilski

Artur Bilski Ruby on Rails &
Javascript Developer

Temat: artJs

Marek Pawłowski:
Tutaj Kamil zwrócił słusznie uwage że dużo lepszym rozwiązaniem jest feature detection niż browser detection.

1). dlatego iż featury w wiekszosci "Normalnych" przegladarek dzialaja identycznie.

2). dlatego ze nie trzeba sie martwić o wykrycie z jaka przegladarką mamy doczynienia. ;)

3). kod jest zgrupowany logicznie (kod dotyczacy kazdej funkcjonalności jest w jednym miejscu i nie musisz szukac po dziesieciu plikach i zastanawiac sie dlaczego zly plik sie wgral etc.)

Tak, całkiem możliwe że projekt w końcowym etapie będzie używał jednego pliku dla wszystkich wersji gdy już będę wiedział jakie są różnice i ile grup w ten sposób powstanie (póki co są dwie)

Przydały by sie unit testy. (i tu kolejna rzecz ktora można by dorobić tak zeby trzymac sie zalożeia self made: framework do unit testów)

Myślałem o tym na samym początku :) I jak najbardziej zbuduję framework testowy, lecz najpierw musiałem mieć framework jako taki.Artur Bilski edytował(a) ten post dnia 11.07.10 o godzinie 14:32
Link do wypowiedziLink
Artur Bilski

Artur Bilski Ruby on Rails &
Javascript Developer

Temat: artJs

artJs
Currently it supports FF, Chrome, Safari, <<Opera>> and IE8.

:)
Marek Pawłowski
mozna by zrobić to async dodajac dynamicznie element script do heada.

Zrobione.
Link do wypowiedziLink
Marek Pawłowski

Marek Pawłowski Trener
Javascript/Senior
developer

Temat: artJs

Dobra teraz troche zboczeń:



./com/arthwood/utils/ArrayUtils.js:11:    var arr = new Array(n);

./com/arthwood/utils/ArrayUtils.js:78:    var args = new Array();

./com/arthwood/utils/ArrayUtils.js:89:    var result = new Array();

./com/arthwood/utils/ArrayUtils.js:145:    var vResult = new Array();

./com/arthwood/utils/ArrayUtils.js:155:    var vResult = new Array();

./com/arthwood/utils/ArrayUtils.js:216:    var result = new Array();

./com/arthwood/utils/ObjectUtils.js:60:    var result = new Array();

./com/arthwood/data/List.js:2:  this.items = items || new Array();

./com/arthwood/events/DelegateCollection.js:2:  this.delegates = delegates || new Array();

./com/arthwood/modules/Locator.js:3:    object.instances = new Array();


1). zmiana new Array() na [] -> zysk 6 * 9 bajtów xD, co ważniejsze zysk z szybszego działania js'owych literali

2). nie wiem czy nie należaloby zastąpić w czterech ostatnich linijkach tych Arraji na ArtJs.ArrayUtils bo poto sobie dekorujemy natywnego Array'a co by go używać



./com/arthwood/utils/ObjectUtils.js:14:    var copy = new Object();

./com/arthwood/utils/ObjectUtils.js:72:    var result = new Object();

./com/arthwood/utils/ObjectUtils.js:84:    var result = new Object();

./com/arthwood/utils/ObjectUtils.js:120:    var result = new Object();

./com/arthwood/utils/ObjectUtils.js:132:    var result = new Object();

./com/arthwood/utils/ObjectUtils.js:144:    var result = new Object();

./com/arthwood/utils/ObjectUtils.js:166:    var result = new Object();


1). zmiana new Object(); na {} -> zysk 7 * 10 bajtów xD



./com/arthwood/utils/ArrayUtils.js:137:    return this.inject(arr, [], this.flattenCallback);

./com/arthwood/utils/ArrayUtils.js:203:    var point = new ArtJs.Point([], []);

./com/arthwood/utils/ElementUtils.js:2:  HIDDEN_ELEMENTS: [],

./com/arthwood/utils/ElementUtils.js:298:    var props = subobjectMatches && ArtJs.ArrayUtils.map(ArtJs.$A(subobjectMatches), this.mapSubDC) || [];

./com/arthwood/utils/ObjectUtils.js:237:        var delegate = ArtJs.$DC(this, this.parseArrayValue, false, prefix + '[]');

./com/arthwood/dom/Selector.js:65:    var family = [];

./com/arthwood/dom/Selector.js:147:    var elements = [];

./com/arthwood/dom/Selector.js:156:        return [];

./com/arthwood/dom/Selector.js:164:        return [];

./com/arthwood/dom/Selector.js:175:            return [];

./com/arthwood/dom/Selector.js:185:        return [];

./com/arthwood/dom/Selector.js:195:          return [];

./com/arthwood/dom/Selector.js:228:    var arr = au.map(matches[0] && matches[0].split(',') || [], this.attrToArrayDC);

./com/arthwood/dom/Selector.js:236:    return matches && ArtJs.$A(matches) || [];

./com/arthwood/utils/ElementUtils.js:284:    var result = au.inject(inputs, {}, this.serializeInjectDC);

./com/arthwood/utils/ElementUtils.js:308:      (obj[prop] instanceof Object) || (obj[prop] = {});

./com/arthwood/net/Ajax.js:19:    this.requestData = this.requestData || {};

./com/arthwood/Initialize.js:3:    data: {},

./com/arthwood/Initialize.js:4:    dom: {},

./com/arthwood/Initialize.js:5:    events: {},

./com/arthwood/Initialize.js:6:    math: {},

./com/arthwood/Initialize.js:7:    modules: {},

./com/arthwood/Initialize.js:8:    net: {},

./com/arthwood/Initialize.js:9:    tween: {},

./com/arthwood/Initialize.js:11:      containers: {}

./com/arthwood/Initialize.js:13:    utils: {}


1). Pytanie dlaczego nie używasz ArtJs.ArrayUtils oraz ArtJs.ObjectUtils

Puszczałeś kod przez jsLinta ;) co prawda duzo jest błedów zwiazanych z indentacja i tym ze nie ma odpowiednich jsLintowych parametrów konfiguracyjnych ale ogólnie wyrzuca 4k lini z poprawkami.
Link do wypowiedziLink
Marek Pawłowski

Marek Pawłowski Trener
Javascript/Senior
developer

Temat: artJs

Jak cos to tutaj masz wklejke do tego co wyrzucił jsLint:

http://wklej.org/id/363224/
Link do wypowiedziLink
Artur Bilski

Artur Bilski Ruby on Rails &
Javascript Developer

Temat: artJs

Nie JSLintowałem jeszcze kodu i zaraz się za to wezmę :)

Co do:
dlaczego nie używasz ArtJs.ArrayUtils oraz ArtJs.ObjectUtils

Używam gdzie tylko można.
Nie wiem czy dobrze Cię zrozumiałem, ale rzecz w tym, że nie mogę założyć dekoracji natywnych obiektów i używać ich w kodzie biblioteki. Framework nie jest inwazyjny i pozostawia developerowi wolną rękę czy chce injectować nativom (poprzez ArtJs.doInjection()) metody który są normalnie helperami. Dlatego w obrębie biblioteki można pisać tylko ArtJs.ArrayUtils.map(myArray, ...), natomiast nie można myArray.map(...)Artur Bilski edytował(a) ten post dnia 11.07.10 o godzinie 19:00
Link do wypowiedziLink
Marek Pawłowski

Marek Pawłowski Trener
Javascript/Senior
developer

Temat: artJs

Broń Cie boże nie ruszać prototypów natywnych obiektów no chyba zeby uzywać nowychych rzeczy z ECMAy 5 i dla zapewnienia wstecznej kompatybilności.

Sorry nie przyjrzalem sie ze to sa helpery to ta temperatura :P

A co do methody ArtJs.doInjection() mogłbyś dodać sprawdzanie czy dana methoda istnieje juz w prototypie, wtedy jej nie nadpisywać i throw'nać jakis błąd żeby cos komuś nieswiadomie nie przestało działać albo zaczeło w nieprzewidywany sposób.
Link do wypowiedziLink
Artur Bilski

Artur Bilski Ruby on Rails &
Javascript Developer

Temat: artJs

Marek Pawłowski:
A co do methody ArtJs.doInjection() mogłbyś dodać sprawdzanie czy dana methoda istnieje juz w prototypie, wtedy jej nie nadpisywać i throw'nać jakis błąd żeby cos komuś nieswiadomie nie przestało działać albo zaczeło w nieprzewidywany sposób.

Framework powinien być ładowany jako pierwszy więc nie ma mowy o nadpisaniu. Co najwyżej dev może coś nadpisać frameworkowi.
Link do wypowiedziLink
« Wróć do tematów
Odpowiedz

Podobne tematy


Następna dyskusja:

ArtJs




Wyślij zaproszenie do
Anuluj