- Luck Dragon: Asszociációs játék. :)
- gban: Ingyen kellene, de tegnapra
- hdanesz: Elektromos autózás - Hyundai Ioniq 28 kWh - 2018
- hdanesz: Hyundai Ioniq 28kWh - Első benyomások - második felvonás
- Lalikiraly: SÜNI energiaital.
- Gurulunk, WAZE?!
- D1Rect: Nagy "hülyétkapokazapróktól" topik
- btz: Internet fejlesztés országosan!
- sziku69: Fűzzük össze a szavakat :)
- Luck Dragon: MárkaLánc
-
LOGOUT
JavaScript != Java (A JavaScript nem összekeverendő a Javával, két különböző programozási nyelvről van szó!)
Új hozzászólás Aktív témák
-
Karma
félisten
Nem egészen, ha ezt tenné, szerintem az összes callback hívásnál a path az utolsó név lenne.
Itt egy példa, ahogy próbáltam rekonstruálni a dolgot a WinJS alapján -
Sk8erPeter
nagyúr
Ja hogy így!
Ez volt a lényeg, hogy stringként adod át, erre kérdeztem rá.($.styled('.foo'))
Mondjuk nem mintha az 1 ms versus 5 ms különbséget túl sűrűn lehetne releváns különbségnek nevezni.
De mindenesetre azt bizonyítja az összes teszt, hogy abban az esetben igencsak megfontolandó a plugined használata, amennyiben RENGETEG elemről van szó, amit egyszerre kell módosítani.
Mondjuk a felrakott tesztedben egyértelműen érezhető, hogy a jQuery-s .css() módosítás mennyivel lassabb. Mármint számok ismerete nélkül érezhető.==================
(#2849) Karma :
ez kurva jó.Amúgy ez tényleg csak viccnek jó, mert az AJAX-os rész azért már igencsak sántít, mert a kód nem cross-browser megoldást mutat.
Na de nem kötekszem.
-
Sk8erPeter
nagyúr
Ez elég durva különbség....
Mondjuk azt nem értettem, miért úgy mérted az időt, hogy a kezdeti időnél new Date()-et használsz, a végénél meg Date.now()-t, akkor már legyen következetes.Mármint az alábbi résznél:
var start = new Date();
...
var end = Date.now();
Nem sok teteje van."Ezért hozzáadtam egy ilyen végrehajtási módot is."
Példa a használatra? -
Sk8erPeter
nagyúr
Semmi különös benchmarkra nem gondoltam.
Csak valami ilyesmire, ami milliszekundumokban mérve kijelzi a scriptek lefutása közötti különbséget:
var startTime, endTime, differenceInMilliseconds;
startTime = new Date();
for(var i = 0; i < 10000000; i++){
;
}
endTime = new Date();
differenceInMilliseconds = endTime - startTime;
console.log('difference in milliseconds:');
console.log(differenceInMilliseconds + ' ms');Itt a for ciklus helyére kerülne a Te kódod, így lehetne tesztelni a hagyományos jQuery-s és a styled pluginos lefutás közötti különbséget.
Egyébként most látom, MDN-en is van példa (csak már megírtam a fentit addigra):
MDN - Date// using static methods
var start = Date.now();
// the event you'd like to time goes here:
doSomethingForALongTime();
var end = Date.now();
var elapsed = end - start; // time in millisecondsMásik:
// if you have Date objects
var start = new Date();
// the event you'd like to time goes here:
doSomethingForALongTime();
var end = new Date();
var elapsed = end.getTime() - start.getTime(); // time in millisecondsLényegében ugyanaz, mint az enyém.
===========================================================
Egyébként érdekes, sokan nem hiszik el, hogy az Opera JavaScript-motorja márpedig igenis gyorsabb, mint a többi jelenlegi böngészőé. Ahogy azt sem hiszik el, hogy a Firefoxé lassú (ahogy lassú a Firefox általában).
Most lefuttattam egy tesztet a fenti, legelső kóddal a konzolból - tehát 10 millió lépéses for ciklus:Chrome 21.0.1180.83 m
Átlag: 9733 ms.
Firefox 14.01
Átlag: 20759 ms (!!!).
Opera 12.01 (x86)
Átlag: 2163 ms (!!!).
A Firefox tehát 3 mérés után átlagban 18596 ms-mal (!!!) lassabban végzett a feladattal, mint az Opera, Chrome pedig átlagban 7570 ms-mal hajtotta végre lassabban az Operánál; a Firefox 11026 ms-mal volt átlagban lassabb, mint a Chrome.
Az Opera tehát elég feltűnően nyert. Ezt a mérést még többször végrehajtottam, mindig hasonló eredményekkel zárult, legfeljebb 1-1,5 másodperc differencia volt az egyenként kijött eredmények között. A teszt idejére egyébként a legtöbb extensiont a böngészőkben letiltottam.
Számomra azért meglepő, hogy 10 millió lépésszámnál már ilyen szintű különbségek jönnek elő.
A Firefox GUI-ja egyébként a teszt idejére lényegében végig teljesen használhatatlan volt ("Not responding").A tesztgép pedig az adatlapomon is látható Lenovo Y570 (Intel Core i5 Mobile i5-2410M @ 2.30 GHz / 1066MHz / 3MB L2 - 2.9GHz Turbo Boost, Western Digital Scorpio Blue WD7500BPVT-24HXZT1, Intel HD 3000 / NVIDIA GeForce GT555M - 1GB GDDR5 VRAM, ...).
-
Sk8erPeter
nagyúr
+ (#2794) Karma :
bocs, most látom, hogy erre elfelejtettem reagálni, pedig ez egy jó téma.
A DOM CSS gondolom azért lehet gyorsabb, mert a böngésző "natívhoz közeli" dolgait piszkálod, nem pakolsz köré egy library-t (mármint itt a jQuery-t). De mennyivel gyorsabb ez egyáltalán?
Végül is attól még, hogy ilyen módon használja az ember, a böngészőnek ugyanúgy frissítenie kell minden elemet, ha az adott selectorra 100'000 elem illeszkedik, akkor annyit.
v2izzy, tudnál esetleg valami benchmark-szerű mérést csinálni erről?Ha már így belementél a dologba...
Kíváncsi lennék, milyen különbségeket lehet mérni, érdekes lehet egy ilyen eredmény.
-
Sk8erPeter
nagyúr
Jaaa értem, tegnap nem esett le. Mondjuk abból, ahogy leírtad, nem is csoda.
Kösz, Karma.
Hogyan valósítottad meg, hogy a jövőben létrejövő elemekre is igaz legyen? Az .on()-nal, ahogy Karma említette? (most nincs időm átbogarászni a kódot, de kíváncsi vagyok)
Viszont így megint csak kérdés, hogy a .set()-nek ilyenkor mit kellene megvalósítania... az lenne a logikus ezek alapján, hogy akkor minden egyező selectorú elemre igaz lesz, hogy melyik fájlban van definiálva maga a stílus, az itt szerintem totál irreleváns. -
Sk8erPeter
nagyúr
"olyan előnye (persze ez valahol lehet hátrány is) van a jQuery-s .css()-el szembe, hogy ez azután is igaz az egyező selector-ú elemekre miután miután a művelet végrehajtódott."
Ezt nem értem. Miért, a .css() miért ne lenne igaz a "művelet" végrehajtása után? Milyen "műveletre" gondolsz?
Vegyünk egy példát, van egy ilyened:
<div class="alma">ASD</div>
Nyomatsz egy ilyet:
$('.alma').css('color', 'red');Ez ennek végrehajtása után is igaz lesz.... persze fogalmam nincs, mire gondolhattál...
-
Sk8erPeter
nagyúr
Ja igen, ezen a .set() metóduson akkor is meglepődtem egy kicsit, hogy hogyan is lenne ez implementálva. Hogyan állítanád át a stílusokat? A fájl módosításához már nyilván szerveroldali programozás is szükséges. Anélkül meg csak kliensoldalon lenne érvényes a dolog, aminek meg így első blikkre nem tudom, mi a konkrét haszna.
Egyébként a megvalósítás szempontjából nekem az tűnne logikusnak, hogy az épp kiválasztott fájlnál történjen meg a módosítás, a többiben ne matarásszon, mert az nem biztos, hogy a kívánt viselkedést eredményezné. -
papa019
senior tag
Az volt a gondom, hogy nem tudtam beletenni az összes adatot a korábbi módszeremmel az obj változóba, igazából nem értettem, hogy hogy kellene megvalósítanom a dolgot.
Nekem az adatok sorrendje teljesen mindegy, csak kirajzolom a polygonokat.
Jelenleg az alábbi módon valósítottam meg a dolgot, remélem nem csináltam benne programozói hibát (végülis működik).
function process_data(items){
var x;
var data = new Array();
data = items;
while ( x = data.pop())
{
var i = 5;
var y = x[i];
var obj = {};
var polygon = new google.maps.Polygon({
paths: google.maps.geometry.encoding.decodePath(String(y)),
strokeColor: "#0000ff",
strokeOpacity: 1,
strokeWeight: 1,
fillColor: "#00ffba",
fillOpacity: 0.4,
editable: false
});
polygon.setMap(map);
var obj = {
'name':x[i-4],
'description':x[i-3],
'address':x[i-2],
'wikipedia':x[i-1],
'points':x[i],
'category':x[i+1],
'parent_area':x[i+2],
'area':polygon
};
polygon.objInfo = obj;
google.maps.event.addListener(polygon, 'click', function(event){
showArrays(event,this.objInfo,this.getPath());
}); //kattintásra megnyílik az infowindow
google.maps.event.addListener(polygon, 'rightclick', function(event){
//this.setMap();
showContextMenu(event.latLng,this.objInfo);
});
infowindow = new google.maps.InfoWindow();
}
}
function showArrays(event,obj,vertices) {
var contentString = "<b>" + obj.name + "</b><br />";
contentString += "Leírás: " + obj.description + "<br />";
contentString += "Cím: " + obj.address + "<br />";
contentString += "Wikipedia: <a href='http://hu.wikipedia.org/wiki/" + obj.wikipedia + "'>hehe</a><br />";
contentString += "Kategória: " + obj.category + "<br />";
contentString += "Szülõ terület: " + obj.parent_area + "<br />";
contentString += "Clicked Location: <br />" + event.latLng.lat() + "," + event.latLng.lng() + "<br />";
infowindow.setContent(contentString);
infowindow.setPosition(event.latLng);
infowindow.open(map);
}A ShowContextmenu függvényt azért nem másoltam be, mert az még nincs kész.
-
papa019
senior tag
Az adatokon való végigmenetellel nincs gondom, nekem jó ez így a pop() fügvénnyel.
A problémám sokkal inkább az, hogy a kirajzolt polygonokra kattintva a kódom hogyan fogja tudni, hogy melyik adatok kellenek neki.Pédául tegyük fel van két poligonom.
Ezeket úgy teszem be az obj-be, hogy: {2.name,2.data,1.name,1.data}
Ugye pont fordítva lesznek az obj-ben, mint ahogy kivettem őket az adatbázisból.De ott van a gond, hogy a polygonra kattintva nem tudom megmondani, hogy az adott poligonhoz melyik tartozik, kellene adni egy id-t, vagy valamit a poligonnak kirajzoláskor, mert így csak a pontok alapján tudom beazonosítani, de azt akkor megint enkódolni kellene, ajax-al átvinni szerver oldalra és csinálni egy lekérdezést az adatbázisból és úgy már megkapnám az adatait.
Viszont én szeretném a JS-ben valahogy átvinni ezeket az adatokat, hogy ne kelljen plusz lekérdezés. -
Sk8erPeter
nagyúr
"A jQuery természetesen ezt csinálja, mert nekik nem ez a lényeg, hogy minden tag-hez külön fgv. stb."
Ja, hanem az a célja, hogy lehetőleg a legtöbb tagre működjön, és ne kelljen a böngészőtől megkapni arra vonatkozó komplett listát, hogy milyen tageket támogat.
Persze ha összegyűjtöd szorgalmas munkával a tagek többségét, aztán belerakod egy array-be, hát oké.
Nekem olyan nagyon nem csúf a jQuery-s szintaktika, amit mutattam.
A tiédnél annyi a különbség, hogy valóban jobban "szétválik", bár pár karakternyi különbség van, tehát szerintem lényegében irreleváns.Amúgy nyilván van haszna a pluginednek, félre ne értsd, most én nem akartam egy csöppet sem szembeállítani!
Jelen esetben csak azt vizsgálgattuk, hogy vajon van-e értelme minden tagről komplett lista alapján létrehozni egy hozzá tartozó "függvényt".
-
Sk8erPeter
nagyúr
Jaaaaaa, értem, jó, így már felfogtam.
Szerintem erre nincs jobb, mintha stringként átadod úgy, ahogy a jQuery-nél lehet, pl. img tag dinamikus létrehozására a jQuery topicban épp mutattam példát: [link]
valahogy hasonlóan kellene megoldanod, persze akkor alternatív utat kell választani, nem ilyen "függvényszerűen" lehet meghívni (pl. div() ).
jQuery-kódban pl.:
// If a single string is passed in and it's a single tag
// just do a createElement and skip the rest
.....Aztán a végére eljutsz oda, hogy felfedezed a spanyolviaszt, és készítesz egy új jQuery-t.
-
Sk8erPeter
nagyúr
"A komplett lista azért kell mert akkor tudom a prototypejába betenni az alap objektumnak a függvényeket (.div(), .span() stb)."
Nem néztem meg a kódodat, és biztos most nehézkes a felfogásom, de most még mindig nem jön át, mi az oka, hogy a createElementes megoldás miért nem elegendő ehhez (tehát ha valaki divet szeretne kreálni, akkor document.createElement('div');). Mit hagyok ki? Mihez kell a komplett lista konkrétan?Példakódra rátérve: én amúgy nem értem, a megfelelő sorok végére miért nem teszel pontosvesszőt.
Sokkal áttekinthetetlenebb így a kód, jó is, hogy a JSLint szól érte.
A korábbi kódot, amit az oldaladról szedtem, elég gyorsan JSLint-validdá lehetett tenni:
http://jsfiddle.net/Sk8erPeter/Pm6pg/1/
Így már szerinte is okés (a class-ból 'class' lett, különben nem jó, mert foglalt névre hivatkozik a JSLint).
Példa még mindig nincs a GitHub-oldaladon.
Amúgy ha bejelentkezel a JSFiddle-oldalon, és ennél a kódnál rámész, hogy "Fork", akkor máris a Te neved alatt fog megjelenni.=========
(#2578) Forza_JUVE :
OK, nincs mit, ha kell segítség, akkor másold be ide a kódot, hogy mivel próbálkoztál, és segítünk. -
Karma
félisten
-
Sk8erPeter
nagyúr
Még annyit, hogy még mindig nem látom, hogy lenne bármilyen konkrétan kipróbálható kód is az oldaladon, ezért csináltam neked egyet kb. 2 perc alatt (csak azért mondom, mert nagyon nem árt egy ilyen demo):
http://jsfiddle.net/Sk8erPeter/Pm6pg/
Esetleg készíthetnél egy jsFiddle-accountot, és csinálhatnál saját neved alatt egy ugyanilyen demót, és belinkelhetnéd a GitHubos oldalra, hogy élesben is kipróbálható legyen.
Egy JSLintet ott a jsFiddle-felületen érdemes lenne legalább ráereszteni, és aszerint validdá tenni a példakódot és magát a "könyvtárat"/modult egyaránt. -
Sk8erPeter
nagyúr
Igen, ezt linkelted, de igazából ehhez nem nagyon értem, miért kellene neked a komplett lista.
Azt meg nem tudtam, hogy stringből generálod le, és nem mondjuk egy document.createElement segítségével (nem néztem meg a kódot), pedig az lenne a logikus.
Amúgy most hirtelen nem jut eszembe, mi az a DOM-elem, ami nem szokott működni, mondjuk ez nyilván böngészőfüggő, ergo IE-ben tuti csomó nem megy, de Chrome-ban ha csinálok egy ilyet:
document.createElement('asd');
Akkor létrehozza ezt:
<asd></asd>
Pedig ez nem egy "valid" tag a szokványos W3C-s DTD-k szerint - de miért ne lehetne ez teljesen valid egy saját DTD szerint?Mi ad vissza HTMLUnknownElement típust?
Ha azt ad vissza, akkor miért nem dobsz vissza egyszerűen egy hibaüzenetet, hogy a megadott DOM-elem valamilyen oknál fogva nem megfelelő, adjon meg mást? -
Sk8erPeter
nagyúr
Hű, hát ez egy jó kérdés. Most hirtelen nem jut eszembe ilyenre megoldás, de egyébként mire kellene ez neked konkrétan?
Plusz kíváncsiságból: milyen tagre akarnál esetleg tesztelni, amit egyik vagy másik böngésző nem támogat (úgy értem, pl. mit nem támogat adott böngésző, amire neked szükséged lenne)?
-
jeges
senior tag
a "nagyobb" függvénytárak mind tudnak ilyesmit gyártani Neked (lásd pl itt, ill az előttem szóló példáit)
ha magad szeretnél ilyesmit, vagy nem akarsz külső függvénykönyvtárat használni, akkor a js eseménykezelési eljárásairól olvasgass (event delegation)
konkrét példát/kódot mondani nem könnyű a konkrét oldal ismerete nélkül.
Új hozzászólás Aktív témák
Hirdetés
- Egyre csak fejlődik az AI, emberek tízezreit rúgja majd ki a BT
- Kerékpárosok, bringások ide!
- Milyen TV-t vegyek?
- A lapkakészlet és az akku különbözteti meg a Motorola Edge 60 és Edge 60 Pro-t
- Milyen asztali (teljes vagy fél-) gépet vegyek?
- Horgász topik
- Parkside szerszám kibeszélő
- AMD K6-III, és minden ami RETRO - Oldschool tuning
- PlayStation 5
- Audi, Cupra, Seat, Skoda, Volkswagen topik
- További aktív témák...
- SanDisk Extreme Portable 8TB (SDSSDE61-8T00-G25)
- Csere-Beszámítás! Sapphire Pulse RX 9070 XT 16GB Videokártya! Bemutató darab!
- Apple iPhone 13 Pro 128GB, Kártyafüggetlen, 1 Év Garanciával
- LG 27GR95QE - 27" OLED / QHD 2K / 240Hz & 0.03ms / NVIDIA G-Sync / FreeSync Premium / HDMI 2.1
- Geforce GTX 1050, 1050 Ti, 1060, 1650, 1660 - GT 1030 - Low profile is (LP)
Állásajánlatok
Cég: PC Trade Systems Kft.
Város: Szeged
Cég: Promenade Publishing House Kft.
Város: Budapest