Managing Programmers by Douglas Crockford at Silicon Valley Code Camp
Hogyan menedzseljünk hatékonyan egy fejlesztőcsapatot
■ H | K | Sze | Cs | P | Szo | V |
---|---|---|---|---|---|---|
24 | 25 | 26 | 27 | 28 | 1 | 2 |
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
31 | 1 | 2 | 3 | 4 | 5 | 6 |
Jó
"There is surprisingly little science in computer science - unfortunately."
"In fact often the best thing you can do to a software system is to remove lines of code."
Abban is igaza van, hogy a programozók legnagyobb ellensége a komplexitás. Azzal viszont nem értek egyet, hogy a komplexitás problémájára szerinte csak egy megoldás van: a tudás. Pontosabban, ez igaz, csak szerintem az általunk generált problémák összetettsége és a rendelkezésre álló intelligencia között egyre nagyobb a szakadék.
Egy rendszer annál összetettebb, minél nagyobb a benne lévő objektumok, valamint a köztük lévő kölcsönhatások száma. Ha bármelyiket vagy mindkettőt növeljük, egyre nehezebben lesz átlátható a kimenet állapota.
Egy másik megoldás, ha az objektumok és/vagy a kölcsönhatások számát csökkentjük.
Ezt a számszerűséget én nem
Induljunk ki az információelméletből. Minden üzenet rendelkezik entrópiával, ami az üzenet által hordozott információ mértéke, és egyben a tömörítés lehetséges alsó határa. Adott információ végtelen számú, tetszőlegesen hosszú üzenetben kódolható, de az információtartalmánál rövidebben nem. A legrövidebb üzenet nem az ember számára legegyszerűbben értelmezhető lesz.
Egy program is rendelkezik egy inherens komplexitással, ami a vele szemben támasztott követelményekből következik, és ugyanígy végtelen számú módon megfogalmazható, de egyszerűbben nem. A számszerűen legegyszerűbb felírása egy programnak nem a fejlesztő számára legegyszerűbben értelmezhető lesz.
Ahhoz, hogy mi emberek kezelni tudjuk a komplexitást, absztrakciókat kell bevezessünk, hogy átláthatóvá tegyük. Az absztrakciók helyes megválasztása az, amihez tudásra és tapasztalatra van szükség.
Nem
Itt egy, a Facebook szerverén kihasználható Remote Exploit történetét lehet olvasni, ami röviden arról szól, hogy az azonosításhoz lehetett OpenID-t használni, viszont az implementációkban volt egy bug, aminek a segítségével egy fájlt lehetett eljuttatni a szerverre, s ott fájlokat listázni vagy akár tetszőleges kódot futtatni.
Egy program egyre több objektumból/komponensből áll, viszont a fejlesztőknek se ideje, sem pedig tudása/intelligenciája nincs meg ahhoz, hogy az összes köztes interakciót átlássák, és ezek hatását felmérjék.
Az absztrakciók számának növelésével nő a hibázási lehetőségek száma és a kiszolgáltatottság, erre is hozok egy egyszerű példát:
Az embernek nagyjából 20 celsius fokos hőmérsékletre van szüksége, hogy operálni tudjon, télen emiatt fűteni kell. A fűtéshez szükséges gázra és egy konvektorrendszerre. A gázt elégetem, a melegvíz eljut a konvektorba, így meleg van a szobában.
Régen a kazánból vastag csöveken szállították a melegvizet, ami nem túl esztétikus, viszont a fizika törvénye miatt automatikusan ment benne a keringés. Amikor bevezették a vékony csöveket, a vizet el kellett kezdeni keringetni egy szivattyúval. Ennek a következménye, hogy ha nincs áram, akkor hiába fűtene a kazán, a melegvíz nem tud eljutni a konvektorba.
Ez egy nyilvánvaló absztrakció, aminek az állítása: meleg van, fűtünk. A lényegtelen, elhanyagolt információ az, hogy ehhez gázra és áramra van szükség. Ha ezek közül valamelyik hiányzik, szivárog az absztrakció, és hideg van.
Tegyük fel, hogy továbbfejlesztjük a koncepciót, és az IoT jegyében elektronikus hőmérővel és mikroszámítógéppel váltjuk ki a termosztátot. Ha ez elromlik, vagy már nem szerezhető be, esetleg feltörik az interneten keresztül, megint nem lesz fűtésem.
A fentiekből következik, hogy a rendszerben lévő modulok számát a szükséges minimumon kell tartani, akár rendszerrel szemben támasztott követelmények számának csökkentésével. Fel kell tenni a kérdést: valóban szükség van erre és erre?
Egy ismerősöm autókereskedőknek fejlesztett webshopokat. Itt úgy mennek a dolgok, hogy a kereskedők folyamatosan nézik a konkurencia weboldalait, és amint megjelenik egy újdonság, azonnal kérik a sajátjukba ugyanazt. Ez az ész nélküli komplexitásnövelés beláthatatlan következményekkel jár.
termosztát
Termosztát: egyrészt a hasonlatod sántít, - mert termosztát azért kell, és a régi sima egyszerű is el tud romlani.
De én bevállalnám hogy okos termosztátom legyen, örülnék ha kikalkulálná a kinti, és benti hőmérséklet alapján, illetve hogy átlagosan mikor vannak otthon a család azt hogy mikor kell fűteni, és hogy mennyire! hogy az ember ne érjen haza hideg lakásba, de mégis gazdaságos legyen a fütés. Én ezt bevállalnám cserébe azért mert x évente elromolhat.
Egyébként meg értem mit mondasz, - de akkor meg hol húzzuk meg a határt? Nem kell ahhoz okos termosztás, és szivattyús rendszer, hogy valami gajra menjen. pl a kazán is romolhat, vagy kilyukadhat a cső..
Szóval javaslom hogy csökkentsd az absztrakciót és vágj lyukat a plafonba, majd rakj tűzet a szoba közepén.
Bántás nélkül, tényleg érdekel: neked miért jó ezeket újra, és újra elmondani? Miért lesz neked jobb ha esetleg sikerült meggyőznöd? Néha én pl egyet tudnék érteni _rész_ dolgokban, de szemelemzős stílusod miatt nem vagyok hajlandó támogatni téged.
Fordítsd meg
Ha azt mondom, hogy enni kell, hogy életben maradjunk, azon nem fog filozofálni senki, mert ez az egyértelmű igazság. De ha azt mondom, hogy ne igyunk több energiaitalt, mert hosszú távon megbánjuk, azt már nem árt megfontolni.
A szoftverfejlesztés tele van gyenge lábakon álló elméletekkel és divattal. Érdemes megfigyelni, hogyan gyengül az OOP, ahogy a funkcionális elemek szivárognak be a nyelvekbe és a napi használatba. Öt-tíz éve gondolta volna ezt valaki? A király stabilan ült a trónján. Nos, ezért nem célszerű az alapján dönteni, hogy mit mond a többség.
Hol kell meghúzni a határt? Occam borotvája megmondja, két lehetőség közül általában az egyszerűbb a jobb.
Ott van például a Go nyelv, nincs benne sem kivételkezelés, sem pedig öröklődés, pedig modern nyelv, a node.js-sel egy időben indult. Ez nem véletlen, az alkotói tudatosan döntöttek így.
Occam borotvája
És ezt már szépen elmondták neked korábban itt a weblaboron..
Ha neked a napi munkádhoz megfelel a funkcionális programozás, akkor hajrá. Én továbbra is úgy vagyok fele hogy PHP-ban OOP-vel vagyok hajlandó programozni, - ahol meg kell a sebesség (mert van ilyen) ott meg inkább választok egy másik nyelvet. De erről eszembe nem jutna meggyőzni téged, - max a kollégáimat, de nekik meg van annyi tapasztalatuk/eszük maguktól is.
"Occam borotváját" nem
lehet hogy neked
Lehet hogy neked funkcionálisan programozni könnyebb PHP-ban, mint OOP-vel. Nekem nem. Nekem sokkal egyszerűbb, karbantarthatóbb, unit tesztelhető, és újra felhasználhatóbb kódot eredményezz OOP-vel programozni nekem PHP-ban.
De erről én nem akarlak meggyőzni.
Funkcionális
google
Hát nem tudom, nekem ebből az jött le hogy te a procedurális programozás híve vagy.
Kimérted hogy ez a gyakorlatba mennyit jelent? Mondjuk egy osztály példányosítása? Mert én igen. Szóval a válaszom: lassabb, szinte mérhetetlenül lassabb, na és?
(és én vagyok az aki nekiáll kimérni hogy az array_merge a gyorsabb vagy + operátor)
Te arra a volt kollégámra emlékeztetsz aki megkapta feladatnak hogy gyorsítsa szerver oldalon a kódot. Új volt, én leültem mellé, és elkezdtem magyarázni hogy hol lassú a kód. Ő ezt végighallgatta, majd figyelmen kívül hagyta, és elkezdte törölni a kódból a kikomentezett részeket, és ezt csinálta több napig. Ezzel gyakorlatban mérhető sebesség csökkenést nem tudod elérni..
Mindegy én bekapcsoltam az apc-t, és pár sql query-t becacheltem, pár oszlopra tettem index-et, ezzel kb 30%-al gyorsabb lett a főoldal kb 1-2 órás fejlesztéssel.
Egyébként meg te miért nem programozól mondjuk F#-ban?
Igen, a procedurális
array.forEach
versusfor
ciklus). Egyébként meg az ilyen cinikus hozzáállás miatt tartunk ott ma, ahol. Eddig például bármely lassú site esetében, ahol saját js kódot írtam, átlagosan 10-20-szoros gyorsulást értem el úgy, hogy a kód kisebb (fele, harmada), egyszerűbb lett, ráadásul több böngészőn futott.saját js kód
Persze ha saját js kódot írsz akkor persze jó eséllyel kisebb lesz a kód mérete. Legalábbis ha előtte olyan library-t használtál aminek mondjuk a 70%-át nem használtad.
És igen sok esetben tud számítani a forEach vs for. Ezt senki se vitatja. Esetleg csak arra szeretném felhívni a figyelmed hogy nem feltétlen célszerű mindig ész nélkül optimalizálni. Se mondjuk két hónapot eltölteni azzal hogy újraírsz minden saját kódból, - ezzel mondjuk elérve 10-20% sebeség növekedést, hanem mondjuk meglévőt optimalizálod (amit előtte kimérsz hogy hol lassú) pár hét alatt.
Szóval ameddig te dobáltad ki a munkaadód pénzét az ablakon hónapokon keresztül, addig én mondjuk megszüntettem hogy ne keressük ki minden esetben jQuery('.example') vel az elemet. Vagy megszüntettem hogy ne építsünk elemenként DOM-ot jQuery-vel. A maradék időben amíg te még a saját kódot írtad, - addig én más produktív a cég számára hasznos munkát végeztem.
Amit újraírtam, azt magamnak
Lehet, hogy én elmondom a
Hogyha te minden alkalommal amellett érvelsz, hogy egy kérdésre egyszerű igazság a válasz, a másik oldal pedig minden alkalommal érveket hoz amellett, hogy a kérdésre nincs egyszerű válasz, és soha nincs egyértelmű konklúziója a vitának – akkor neked is be kell látnod, hogy kinek van igaza.
Pontosan milyen összetételű energiaitalokról van szó? Egyáltalán nem szabad energiaitalt inni? Lehetséges, hogy bizonyos mennyiség kedvező élettani hatású? Hol húzódik a határ a kedvező és a káros mennyiség között? Milyen külső tényezők befolyásolják?
a másik oldal pedig minden
Az energiaital nem üdítő, hanem időzített bomba
A munkám során a felvetődő
Az egyszerűség csak egy szempont a sok közül, amik mentén döntünk. Erre leegyszerűsíteni egy döntési folyamatot elég öngyilkos megoldás. Nem is csinálja senki. Te se :) Még ha azt hiszed, akkor se.
Nem tudtunk az Extnél
A programlogika egyébként maradt, de a rajzoló és eseménykezelő eljárást jelentősen leegyszerűsítettük. Hogy egy példát mondjak, az ilyen keretrendszerek egyik jellemző hibája, hogy az eseménykezelőket az elemhez azonnal hozzárendelik, ami egyrészt 10-20%-kal lassítja a megjelenítést, másrészt meg minek? Egy űrlapon általában nagyon kevés interakció van, bőven elég akkor csinálni valamit, ha az elem fókuszt kap.
Tudom, csak ez pl jó példa
Nem értem
A válaszod alapján nálatok a
Ez következménye volt az
Nem tudtunk az Extnél
Akkor közelítsük meg más
Döntést hozunk:
1, marad minden a régiben, ez Blaze szerint az egyszerűbb (hisz nem kell csinálni semmit),
2, újraírjuk, és akkor pontosan az fog történni, amit mi szeretnénk.
Az 1,-es pont csak látszólag egyszerűbb, valójában ez a komplexebb, ugyanis a megjelenítő kód bonyolultsága megmarad az eredetinek.
A 2,-es pont látszólag bonyolultabb, hisz bár újraírjuk a rajzolást, a kód jelentősen leegyszerűsödik, annyit, és csak annyit csinál, amennyire épp szükség van.
Vagyis egy egyszerűnek tűnő
Hát én személy szerint
Jól sejtem, hogy ez még ext3 volt? Úgy rémlik ext4-től ki vannak gyomlálva ezek a hosszú öröklési láncok, és áttértek a composition over inheritance tiszteletére. De lehet rosszul tudom, nem foglalkoztam már nagyon régóta azzal a rendszerrel.
1500 űrlapelemet kirenderelni
Ki kell hogy ábrándítsalak,
Rendben, vagyük a példádat.
A követelmények meghatározásáról a fejlesztés kontextusában beszélni értelmetlen, mert azokat a fejlesztés előtt kell meghatározni, fejlesztés közben azok adottak.
Az implementációban senki nem kérdőjelezi meg az egyszerűség fontosságát, a baj az, hogy az egyszerű szubjektív, de legalábbis sokféleképp értelmezhető. Az azonban egészen biztos, hogy az egyszerűség mértéke nem az absztrakciók száma, mert éppen az absztrakció az eszköz, ami segít az egyre növekvő komplexitású követelményekből fakadóan egyre növekvő komplexitású implementáció átlátásában állandó szellemi kapacitás mellett.
Egy program is rendelkezik
Példa:
A már sokat emlegett Ext.js-ben egy űrlapelem létrehozása átlagosan 2-8 számú öröklődési láncon keresztül történik. Az elem konstruktora megkapja a bemenő paramétereket, majd meghívja a szülői fán felfelé az összes többi konstruktorát. Ebből létrejön egy szép nagy objektum egy csomó belső tulajdonsággal.
Igen ám, de a tapasztalat szerint egy űrlapot az adott rekord adatainak kitöltése után már nagyon ritkán módosítanak. Akkor miért hozzuk létre minden alkalommal a fenti objektumot, amikor az űrlapot kirajzoljuk? Bőven elég egy darab divet kitenni a képernyőre, és csak akkor dolgozni, amikor valóban szükség van rá (valamilyen módon fókuszt kap).
Körülbelül két hete merült fel bennem, hogy egy űrlapra tulajdonképpen miért rakunk fel n darab beviteli mezőt, amikor egyszerre úgyis csak egyben lehet a kurzor? Egy ilyen elem kirajzolása elég költséges, ugyanis egy csomó eseménykezelőt rendel hozzá a böngésző; méréseim szerint nagyjából kétszer annyi idő a renderelése, mint egy
div
é. Bőven elég lenne kirakni mindenhova diveket, aztán, amikor rákattint valaki, akkor felé pozícionálni egy ugyanolyan méretű, átlátszó beviteli mezőt.Egy ilyen elem kirajzolása
Ez az a szintű mikrooptimalizálás, amin a bölcs, tapasztalt programozók csak mosolyognak. Ha a csapatukban vagy, esetleg lekevernek egy nyaklevest. Bár lehet ezt már csak trollkodásként írtad, nem tudom eldönteni.
Az ExtJS-é szerintem sem okos megoldás (sőt), de te a ló túloldalán fekszel a sárban. Azzal is elbeszélgetnék, aki ilyen mennyiségű formelemhez az ExtJS-t választotta megoldásként.
Makro
Ennyi adatot a szerveren össze is kell állítani, ki is kell küldeni. Ezen a szinten már számítanak az ilyen apróságok is.
1600 elemű űrlap, amiből kb.
Teljesítmény szempontjából ez biztos izgalmas feladat. De a felhasználók tudnak kezelni ennyi mezőt? Ez brutálisan sok. Van olyan feladat, amihez rengeteg input kell, de ez koncepcionálisan biztos jó? Erre nyilván semmilyen UI framework nem való.
Egyrészt a pufferelés miatt
Az 1600 úgy jön ki, hogy negyven sor van nagyjából negyven cellányi információval. Ebből talán meg lehetne spórolni 5-öt, de akkor is nagyjából ugyanott lennénk.
lehet hogy értelek
Off: azért megnézném én is azt a form-ot amin 1300 beviteli mező van. Főleg hogy az adatlapodon ez áll:
"Érdeklődési körök:
Frontend technológiák, felhasználói felületek tervezése, usability, szemantikus web, XSLT."
Nagyon jól megértetted a
Ha megnézed bármelyik keretrendszer saját oldalán lévő példákat, azok tipikusan Móriczka-egyszerűségű alkalmazások, amivel csak annyi a baj, hogy a való életben nem erre van szükség. Nem kihívás infinite scrollt egy olyan listán prezentálni, amiben soronként egy div van. Így viszont fejlesztőként nem lehet felelős döntést hozni, hogy melyiket válaszd egy új projekt esetén.
és az számodra
Vagyis tudja mikor kell használni, és tudja hogy hogy.
"fejlesztőként nem lehet felelős döntést hozni, hogy melyiket válaszd egy új projekt esetén."
De lehet, én pl mobile verzióba eszembe nem jutna behúzni az ext js-t. desktop verzióba lehet. Függ a feladattól. Feladathoz kell eszközt választani, és nem fordítva. ("fúj minden absztrakció")
Elképzelhető, de biztos nem
Ez szerintem az az eset,
Lehet lenyűgöző egy
A saját példámon látom, hogy
Anno mindenki szidta az IE6-ot, hogy milyen bugos, de arra nem vették a fáradságot, hogy találjanak olyan módszert, ami működik minden aktuális böngésző alatt, pedig mindegyik hibájára volt megoldás. Vagy hogy nem lehet alatta átlátszó png-ket használni, bezzeg a Mozilla - pedig akkor már évek óta volt kidolgozott módszerem a dologra.
Persze, csak nem mindegy,
+1
"Anno mindenki szidta az IE6-ot, hogy milyen bugos, de arra nem vették a fáradságot, hogy találjanak olyan módszert, ami működik minden aktuális böngésző alatt"
Gábor te hol dolgozol? Hol mondja meg a fejlesztő hogy milyen böngésző az amit támogat?
Ez szerintem normális helyen úgy zajlik/zajlott IE6-esetében hogy:
- valamit megcsináltunk működött mindenhol kivéve IE6
- ha elvárás volt hogy működjön, és ugyanúgy nézzen ki IE6-ban akkor megcsináltuk, ha nem volt extra erő befektetés.
- ha átlagon felüli extra befektetés volt az IE6 support annál a feature-nél, akkor szóltunk a vezetőnek, PO-nak hogy "két nap lesz az hogy IE6-ban is ugyanúgy nézzen ki, - megcsináljuk, vagy hagyjuk így hogy ott nincs lekerekítve az a doboz?"
és a PO/vezető szépen eldöntötte a kérdést.
Marhára nem "nem vettük a fáradságot"... - ha igény volt rá megcsináltuk, ha nem volt igény rá nem csináltuk meg.
Gábor meg lehetőség szerint kérlek ne nézd már a komplett szakmát hülyének, és lustának.
Ezt a mondatot én sem
Hát hálistennek már lassan
Pont nemrég játszottam vele,
Igazad van, bocsánatot kérek
Persze, messziről jött ember azt mond, amit akar, úgyhogy beszéljenek inkább a számok! 2009-ben, még a CSS3 éra előtt én készítettem az iWiW egyik sitebuild-jét (talán az utolsó előttit) külsősként. Egy oldalra tettem fel minden elemet, így a backend programozók onnan mazsolázgatták össze a különböző blokkokat.
Mint látható, nem egy manapság divatos, minimalista dizájn, bár nem is igazán bonyolult. A HTML + CSS kód összesen 24411 + 30995 = 55405 bájt, az IE hack-eket tartalmazó CSS 719 bájt, ami a teljes kód 1,3%-a. Ennyi plusz munkát jelentett az IE6 és IE7 támogatása, az oldal IE 5.5 alatt 90%, 5.0 alatt pedig 80%-os volt, azaz teljesen használható, pedig ez utóbbi két böngészőben más a dobozmodell.
Érdekességként megjegyzem, hogy a tervezés fázisában az iWiW részéről felmerült az Ext.JS használata, amiről én beszéltem le őket.
és most mit szerettél volna elmondani?
"az IE hack-eket tartalmazó CSS 719 bájt"
tévedsz, az egész egy IE hack.
"iWiW részéről felmerült az Ext.JS használata, amiről én beszéltem le őket."
Okos döntés volt.. Ja, pont az iWiW-et akik korábban indultak mind a facebook, de a végén túl lassan fejlődtek. (és terjeszkedtek)
Szóval lebeszélted őket az ext js-ről, ettől ők lassabban készültek el, - és ráadásul végeredmény meg még felhasználó szempontból is lassú lett.
(megjegyzés: nem tudom hogy 2009-ben iWiW helyében használtam volna-e ext js. de az biztos hogy a gyors dinamikus, gyors release-ek irányába mentem volna el. És igen tudom utólag könnyű okoskodni, de ez már akkor is így gondoltam)
Ha pixelesnek látod, az a jó,
kezdek belefáradni ebbe a beszélgetésbe
Ki beszélt backend oldalról? iwiw mindenhogy lassú volt. backend, és frontend oldalon is.
És azért IE hack az egész, mert a komplett oldal képekből áll, és azért áll a komplett oldal képekből mert az IE-ben csak úgy lehetett megoldani. (és téged nem érdekelt az akkori modern böngészők _normális_ támogatása)
"A border-radiust nem támogatta az akkoriban még eléggé elterjedt IE 7-8 páros."
És akkor mi van? a firefox meg támogatta, aminek nagyobb volt a részlesedés mint az ie nek összesen. Vagyis te úgy optimalizáltál a kisebbségre hogy a többséggel kitoltál. okos.
(nehéz megérteni hogy mi azért szidtuk az IE-t mert - mondjuk a border radiust témánál maradva - megcsináltuk a lekerekített sarkot css-ből, de az IE-ben plusz munkával meg még csinálhattuk meg hogy ott meg kép behúzással)
iwiw mindenhogy lassú volt.
Én inkább feláldoztam ezt a kemény 1 ezredmásodpercet, és legalább minden böngészőn ugyanúgy nézett ki. Viszont akárhogy nézem, túl sok képet ma sem tudnék megspórolni, tele van az oldal apró ikonokkal.
számolni az tudsz.
"túl sok képet ma sem tudnék megspórolni, tele van az oldal apró ikonokkal."
Komolyan? 60 kép betöltésből ma se tudnál sokat megspórolni? Ezt most tényleg komolyan mondod?
10, max 15 nél több képet nem lenne szabad behúznod. tudod sprite is van a világon. (és akkor arról most már nem beszélünk hogy talán már te se csinálnád a box kerekítést képből, vagy a szín átmeneteket képpel. bár ezek után ebbe se vagyok biztos)
Én : "iwiw mindenhogy lassú volt. backend, és frontend oldalon is"
Te: "Ehhez nekem már semmi közöm, csak a HTML-t kellett elkészítenem, a többi már a Virgo feladata volt."
Tényleg behúzul 60 képet a felhasználókkal és semmi közöd hozzá hogy lassú lesz?
Hmm, egy tucat képen
http
Szerintem elégé világos hogy nem a processzorizzasztásról beszélek. De ha nem lett volna világos az előbb már egyszer leírtam. De akkor újra: nem erről beszélek.
"azonos szerepű ikont sprite-tal oldottam meg"
Miért az nem azonos szerepű sprite-okat nem lehet sprite-olni? technikai akadálya lett (pár éve nem frondendezek), vagy vallási oka van?
".....sávszélességfogó művelet"
Ugye tudod hogy működik a http?
Ferdíteni azt tudsz. te 1ms ról beszélsz hogy annyival lassabb a kirajzolás.. (úgy hogy senki se beszélt a kirajzolási sebességről)
Akkor elmondom a bajom: 1 darab kép betöltése még ha csak 1x1 px-eles is, akkor is kb 50ms (mert kb ennyi idő kell neki mire leér a szerverről)
Ajánlom tanulmányozásra ezt:
http://www.webpagetest.org/result/160212_J8_1WRC/1/details/
a 160KB fél másodperc lehúzni, mert 60 darabban van
Csak az azonos jellegű és
Ez viszont az oldal kirajzolási sebességét és a felhasználói élményt biztosan nem rontotta, hisz egyrészt a böngészők egyszerre több párhuzamos http kapcsolatot tudnak nyitni (az 500ms-t oszd el nyugodtan néggyel), másrészt fix elemmérettel és - ha nem átlátszó a kép, - fix háttérszínnel dolgozom, ahol lehet, azaz a háttérképek leérkezése előtt a böngésző már ki tudja rajzolni az elemet a végleges méretével.
Az első betöltés után meg már minden gyorstárból jön.
párhuzamosítás
Szerintem vizsgáld felül ezt a megszokásod.
"Ez viszont az oldal kirajzolási sebességét és a felhasználói élményt biztosan nem rontotta, hisz egyrészt a böngészők egyszerre több párhuzamos http kapcsolatot tudnak nyitni (az 500ms-t oszd el nyugodtan néggyel), "
Ez a 4 honnan jött neked? az IE6-7 nél az kettő volt.
Másrészt miért kéne elosztanom akármennyivel is? Megnézted a linkem? a valós körülmények között volt fél másodperc a képeid betöltése IE 11-ből - frankfurból
Igen van gyorsítótár is a világon, de azért azt tudni kell hogy nem telepátiával tudja meg a kliens hogy mi a legfrissebb verzió az adott tartalomból. Ez 60 képnél 60-kérés.
Ha a háttérképeket fix méretű
Egyébként nem értem, hogy kapcsolódik a szálhoz ez a sprite-os dolog, hisz ez nem böngészőspecifikus.
sprite
Már miért ne lehetne megtenni? Legfeljebb lesz egy üres rész a sprite-ba később, és?
Pl nézd meg a google egyik sprite-ját:
https://www.google.hu/images/nav_logo242_hr.png
A sprite meg onnan jött a szálba hogy azt mondtad hogy ma se tudnád sokkal kevesebb képpel megoldani azt a design. Én meg közöltem hogy sprite is van a világon.
És igen ha normálisan be vannak állítva a cache-ek akkor a második kérésnél már "gyors" lesz. Csak ezzel a logikával az a gond hogy ha lassú a site, akkor nem lesz második kérés, a felhasználók ott hagyják az oldalt.
Most komolyan pont te próbálod megvédeni a fél másodperces lassúságot? Pont te?
Sprite
háttérképek
Ez csak akkor lenne igaz ha az egész oldal hátterekből állna. Tudod az iWiW-en volt némi tartalom is, pl az ismerőseink képei. Na most ha te 60 háttérképpel töltöd ki az időd akkor a fontosabb tartalom később fog leérni a userhez.
Nem tudom már hogy mondjam, nem a processzor idő, nem is a képek mérete a fontos, hanem hogy a sok apró fájlak fogtad a böngésző szálait amik tartalmat töltötték be.
Először
fél másodperc.
"jönnek be legrosszabb esetben a nem a dizájnhoz tartozó képek."
Azt ugye tudod hogy a gyakorlat a legrosszabb esetről szólt? A css-be voltak megadva a képek, - a css html elején volt megadva, azért a böngésző először azokat töltötte be, és nem később a html-ben szereplő képeket.
"Ezen felháborodok, az ismerősömmel örökre összeveszek, majd szépen átmegyek a Facebookhoz."
Szeretem ezt a fajta érvelést, közlőd hogy az 1ms lassulás, elmondom hogy az fél másodperc, kicsit vitatkozunk, majd közlöd hogy "áá a fél másodperc se számít"
De akkor segítek rávezetni: a gyakorlatba nem 1 másodperc alatt jött be az iWiW. Nem mondom hogy csak miattad, - de közre játszott az is hogy 60-képet behúztál, mert nem sprite-oltál normálisan, és olyanokat is képpel oldottál meg amit css-ből is lehet volna oldani a többségnek.
Továbbra is érzékenyen
aszinkron ?
Annyira teljesen aszinkron hogy az IE6-7 kettőt is hajlandó volt párhuzamosan csinálni. Vagyis párhuzamosan két szinkron dolgot csinált.
Továbbra is érzékenyen kerülöd, hogy az első betöltésről beszélünk, ami egy landing page, ahol regisztrálni lehet, még felhasználók képei sincsenek rajta.
1, a userek nem mindig a landing page-re érkeznek.
2, a landing page ha jól rémlik marhára nem így nézet ki. ergo ezeket az apró 1x1 -el képeket nem ott töltetted le velük.
3, nem lehet végtelen ideig cache-lni a statikus tartalmat. (ha csak nincs kezelve a verziózás normálisan)
A háttérképek letöltése és
Emlékeztetlek, hogy a fentebb linkelt oldal tartalmazta az összes elemet, amit a teljes iWiW site-on használtak. Az egyes oldalakon ezeknek csak egy része jelent meg. Az meg, hogy mennyi ideig tart a gyorstárazás, majdnem teljesen indifferens a probléma szempontjából. Ha rosszul csinálták, akkor rövid ideig, ha jól, akkor sokáig. Ez most már sosem fog kiderülni.
Lehet ezen még rugózni, abba a tizenhárom képbe és stílusdefinícióba elég jól belekapaszkodtál mint utolsó szalmaszálba, de valahogy továbbra is az az érzésem, nem ezen múlott, hogy az iWiW gyors volt-e vagy lassú.
60 fájl
Szerencsére a modern böngészőkben a JavaScript-et is lehet async módon betölteni, és lehet aszinkron módon számoltatni javascriptben. (úgy hogy nem akad meg a főszál)
"tizenhárom képbe"
nem 13. 60.
De mindegy. Tőlem mikró optimalizálj továbbra is 1ms-okat, és veszítsz máshol fél másodperceket. mert az nem számít, mert csak egyszer kell, mert csak landing page, meg egyébként is..
Bánom én.
Szerencsére a modern
Akkor zárásként foglaljuk össze:
- A 2009-es iWiW gyakorlatilag minden böngészőn ugyanúgy jelent meg, ennek az ára, hogy 13 képet kellett pluszban betölteni első alkalommal
- a képek egy további részét egy sprite-ba lehetett volna tenni, így az első töltésnél meg lehetett volna spórolni böngészőtől függően 100-200 ms-t, amíg ezek a háttérképek betöltődtek
Ennyibe tudtál belekötni. Most lássuk neked pár 2009-es munkádat! Csak hogy legyen mivel összehasonlítani.Te honnan szülöd a számokat?
Ezt a 100-200ms honnan szülted?
Fél másodperc. kérem szépen, már sokadszor mondom, fél másodperc.
"ennek az ára, hogy 13 képet kellett pluszban betölteni első alkalommal"
Az ugye világos hogy ha (had használjam a te szavaid) "vetted volna a fáradságot" akkor ezt a 13 -képet megsporolhatad volna az akkori modern böngészők használóinak (akik már akkor többségben voltak). és akkor sprite-olásról nem beszélünk.
Az ugye világos hogy ha (had
Ennyi, be lehet mára zárni az internetet.
Fél másodperc. kérem szépen,
edigital?
edigital.hu meg backend oldalt csináltam nagyrészt. És mellesleg amikor ott voltam akkor megcsináltam hogy fele annyi legyen az oldalbetöltés a user-eknek. Csak szólok. (és amikor ott voltam egyszer se döglődött le az oldal pl black friday alatt se)
És csak hogy értsd ez a sprite: edigital sprite
(igen ezt én csináltam, igen az urlben a verziózást is, és az subdomain-ezést is) (bár ahogy nézem az urlben a verziózást kicsit elszúrták azóta:)
Csak azért hoztam fel a
És akár hiszed, akár nem, még délelőtt láttam az itt linkelt sprite-ot, és az alapján írtam, hogy igazad van.
Az a különbség, hogy ő nem
iwiw vs személyes weblap?
Ott az edigital-ál. lehet az köpködnöd. (bár egyáltalán nem az a legnagyobb site ahol dolgoztam, közel sem.)
Csak ami az eszembe jut (ezeket én csináltam, és ennél fontosabb hogy az kezdeményezésemre csináltuk)
- optimalizáltam a css, js behúzást.
- a termék képeket betöltését oldalbetöltés utánra időzítettem.
- sprite-oltam a képeket
- tömörítettem a css, js-t
- megcsináltam az urlben a verziózást.
- kiküldtem a cache header-öket
- elkezdtünk használni cdn-t
- külsős js script-eket átírtam aszinkron működésre. (ha ők lehalnak ne haljon meg az edigital)
- elkezdtünk használni több sub domain hogy párhuzamosan tudjanak lejönni a statikus tartalmak.
De fogalmam sincs hogy ezekből mi maradt meg azóta.
(és egyáltalán nem vagyok büszke az edigital-ra. - sok mindent rendbe raktam ott én úgy érzem, sok mindent szabad időmben, - de nagyon sok mindent lehetne még ott tenni)
Én ezt elhiszem, de pont
nem én ezeket kijavítottam
Amiket én kijavítottam. - úgy hogy marhára nem tartom magam frontend fejlesztőnek..
edigital sprite
iwiw egyik sprite a sok közül
Látszik a különbség?
A lassúság meg sok esetben apróságokon múlik. az előző hozzászólásomban a listán szereplő tételek megcsinálásával (kb 1 hét volt) felére esetet az oldalbetöltési idő.
Optimalizálok én is, sokat, de először ott kezdtem ahol sokat tudok nyerni vele kis erőbefektetéssel. És erre szerettem volna célozni hogy ha már foreach sebességén lovagolsz állandóan akkor talán másol is lehetne optimalizálni
Optimalizálok én is, sokat,
Azt hiszem érdemes kiemelni a lényeget, hogy más is lássa. :-)
Sprite-ot miért nem
ritkán frissült
Illetve valami miatt valószínűleg most is kézzel csinálnám az edigital alá a sprite-ot, - de azt nem nem mondhatom el sajnos. :(
(ahol most dolgozok ott szerintem generálják a frontendessek a sprite-ot. nagyon helyesen)
(Balázs, kicsit kevesebb
elnézést
Elnézést, és Gábortól is ha megbántottam.
(
Viszont részemről még pár hozászolást szentelek neki, - ha nem sikerül nála elérni valamit (vagy neki nem sikerül meggyőznie az igazáról)
Akkor jó eséllyel én léptem a weblabor-ról. :-(
)
Nem fogsz nála elérni semmit.
Miből gondolod, hogy egy
Számold hozzá a képfájlokat
Mindez persze már nem számít, a pattintott kőkorszaknak vége.
Összeszámoltam, 13 képről van
Valami okból azzal hencegtél
A számok alapján nem győztél meg, hogy a te módszered jobb volt. Egy biztos. Ha mindenki úgy gondolkodik mint te, nem lenne minden böngészőben ma pl border radius. Én pedig már nem lennék frontendes. A szobrász aki kanállal faragja a követ, bár valahol szép teljesítmény és rohadt büszke rá, mégiscsak sültbolond.
Tizenhárom kép és kettő egész
Minek érvelnék. Eddig sose
Az említett sültbolond akkor problémás, ha prófétának képzeli magát.
Balázs a te malmodra hajtja a vizet, és hamarosan őt is sikerül elüldöznöd innen. Hosszú a lista már.
Na de ha már felhívtál
Józsi elkészíti IE hackek nélkül ugyanazt a sitebuildet (a web akkori fejlettségi szintje szerint), amit Gábor készített. A 30kb CSS-ből így 5kb-ot (direkt kicsit írtam) megspórol. Ez az 5kb átkerül az IE-only CSS-be. A látogatok 35%-a így ugyanannyi adatot tölt le, a többiek 5kb-tal kevesebbet. Egy nagy látogatottságú oldal esetén, mint például az iWiW (ide jöhet egy adat az oldaletöltésekkel, nem nézek utána), egy év leforgása alatt a szerver mennyivel több/kevesebb adatot fog így kiszolgálni? Mit szól ehhez Gábor, aki köztudottan híve a környezettudatos munkavégzésnek?
Mint látod, nagyvonalúan kihagytam azt a 2kb-ot (és a vele járó lekéréseket, amik szintén csak 35%-ot érintenének), ami itt szerinted elhanyagolható, más threadekben technológiák bukását követelted miatta.
Jó lenne a példa, ha
Módosítsd nyugodtan a
Reméltem elsőre meglátod a lényegét annak, amit írtam.
Előbb írj ki rendesen egy
Miért menekülsz el mindig,
Az én szótáramban benne van, hogy "tévedtem".
Milyen szakmai érvek?
Ez még mindig menekülés. Az
Hány terabájt forgalmat tosztál ki az ablakon, energiatakarékos programozás élharcosa? Vagy nem tudtad, hogy többmilliós forgalmú oldal sitebuildjét készíted?
És a fő kérdés: mit nyertél azzal, hogy IE-re optimalizáltad a fő stíluslapot? Tényleg kíváncsi vagyok. Mert bár mi nem vettük a fáradságot, hogy megoldásokat keressünk problémákra, lusta disznóként szlopáltuk az egészségtelen kólánkat, de a mi oldalaink is működtek minden böngészőben, és nem voltak nagyobbak se, mint a te oldalaid, sőt a többségnek (az általad elfogadott 65% számára) kisebbek voltak, akkor mégis mi a francot nyertél az egészen?
Tudod az még nem lenne olyan nagy baj, legfeljebb neked, ha a saját dogmatikus hülyeségeidet előbbre helyezed a tényeknél, a tényeket pedig csak akkor veszed figyelembe, ha épp alátámasztják az álláspontodat, de hogy emellé még folyamatosan az ellenkezőjéről prédikálsz 0-24, az baromi szánalmas, unalmas és destruktív. Maradj csöndben, tedd félre a berögzült elméleteidet és figyeld a világot. Tök jó.
Mondj konkrétumokat, minek az
Válaszolj a kérdéseimre.Azt
Azt is elfogadom, ha beismered, hogy tévedtél és ostoba módon fikáztál olyanokat, akik nálad okosabbak voltak.
Elég már belőled. Vagy húzz el innen, vagy tanulj meg viselkedni, kommunikálni, vitatkozni. Sajnálom, hogy erre nekem kell figyelmeztesselek.
Azt is elfogadom, ha
Ez nem ennek az Istennek az idejében fog megtörténni. Mondjuk már jön be az iszlám, úgyhogy lehet, hogy még a te életed során. xd
Mert ki vagy te, hogy
A közösség egy tagja. Annak a
De ismét felszólítalak: vagy viselkedj, vagy menj és ne gyere vissza.
Kibic
Akkor egyikünknek mennie
Távozz innen sántán!
Urak, ezt a szálat tényleg az
Részemről igen, lássa
Ádám, válaszút elé kerültél,
"Nem muszáj olvasni."
Aha, tényleg nem. El lehet üldözni az embereket innen. Ahogy már az összes kollégám (akit személyesen ismerek) sikerült.
És én is határán vagyok. 2016-ban azzal hogy vesszen az oop, vesszen az ajax, meg minden ami modern, azzal nem tudok mit kezdeni. Főleg egy olyan emberrel akit meg kell győzni hogy sprite-olni jó dolog.
Nem is kell mit kezdeni,
Én is pacifista vagyok, de
Én is azt tapasztalom, mint solkprog. A Weblaboros bögrémet vagy megmosolyogják, vagy szomorú nosztalgiával tekintenek rá.
Harcolj!
Szóval úgy véled, hogy annak
évekig megtettem, ignoráltam
Látszik is hogy az utóbbi pár évben szinte nem is szóltam hozzá a weblabor-on..:( (pont miatta)
Viszont én eddig bírtam, már alig van értelmes arc a weblaboron, - és már szinte nincs értelmes topic. És nem csak komolyabb topic-ok - amit szinte már csak te küldesz be -, hanem már kezdők se írnak ide szinte. De azt a pár topic-ot is szét offolja.
Hát én sem nagyon küldök már
Menekülés a konkrétumok elől...
Ja, Gábor, a próféta, a
Nehogy elmenj, inkább maradj
Látom, nem érted a dolgot. A
És nem lehet ezt az űrlapot
Sajnos nem
Értem a dolgot, és együtt is
Ha olyan házat kell építeni, aminek alul van a teteje, akkor érthető, ha az általános házépítő technikák nem fognak működni. Ez nem azt jelenti, hogy a technikákkal baj van, és azoknak is szopni kéne, akiknek nem kell 1500 elemet kipakolni egy űrlapra.
Ez a folyamatos haragvás a világra, a programozókra, a cégekre, a technológiákra meg mittomén még mire nem tesz jót. Lazíts kicsit.
Okoskodni könnyű, ez igaz. Ha
Viszont így már értem a keserűséget, ezúton biztosítalak együttérzésemről.
Rendben, urak, miután