Rival Blog

Taky pozorujete ve svém okolí zvýšenou poptávku po slevových kuponech? Všude se to hemží Slevomatama, Cupolisama… pralinky za polovic, masáže za tři kilečka nebo bungee jump za litránka?

Tento systém kolektivního nakupování vymysleli samozřejmě v Americe, a v našem rybníčku se začíná prudce rozmáhat až nyní. Ve spojení s Twitterem a Facebookem, kde se každý rád podělí o to, co si právě koupil, se z toho stává mocný marketingový nástroj. Počet nakupující dosahuje u dobrých nabídek i několik stovek! Prvním takovým serverem u nás byl Slevomat, který si drží prvenství i díky příchodu investora v podobě internetové agentury Miton ;)

Aktuálně vím o 4 serverech nabízející kolektivní nakupovaní.

• Slevomat (Praha, Brno, Olomouc)
• Cupolis (Praha)
• Vykupto (Praha, Brno)
• Hypersleva (Liberec)

Také mezi nimi panuje řádný konkurenční boj, zejména Cupolis do toho šlape až na hranici etiky ;)

Sám jsem pár poukazů koupil, takže se na slevové vlně také vezu, nicméně znám i lidi (zdravím Vondru), kteří si z poukázek dělají sbírky a nestačí je využívat ;)

Znáte nějaké další české servery? Nakupujete sami poukázky?

P.S.: Pro milovníky slev jsem udělal minisajtu na adrese http://skrz.cz – pracovní název zní „slevy skrz naskrz„, protože lepší nevyužitou doménu jsem nenašel a registrovat si kvůli tomu nějakou, na to jsem příliš líný…

Tak nevím jestli bude jednodušší zrecenzovat film Sedm, nebo napsat sedm linků z mého „bloggerského“ života. Nedivte se prosím uvozovkám okolo slova „bloggerského“, neb 67 příspěvků za rok a půl opravdu blogování nazývat nelze. Nu ale k věci, nebojte, bude to krátké. Otázky jsem opsal od Petra Koubského, který jej okopčil od Misantropa, a ten zas od Větrovky.

Můj první post

Psal se rok 2008, bylo to krátce po našem nastěhování do Prahy a já jezdil do práce metrem, jmenovalo se to „Jak se pohybovat v metru“ a vysvětlovat není třeba.

Post, který mě nejvíc bavilo psát

Proč miluju Prahu… – netřeba další komentář, je prostě božíčková…

Post, který měl skvělou diskusi

Poděkování hned v prvním postu, to se jen tak nevidí – „Jak na Facebook Apps – založení aplikace“

Cizí post, který bych si přál napsat sám

To si přeju každý den několikrát když čtu Johna, Misantropa, DFense a desítky dalších…

Můj nejužitečnější post

Jeden z mého programátorského života pro projekťáky, tam prostě nejde lhát – „Odhady programátorů násobte dvěma“

Můj post s nejlepším titulkem

Tak na tenhle „výkon“ jsem hodně, hodně pyšný – „75. místo„. A tak si u toho říkám, že píšu hrozně pravdivé titulky, žádné bulvární, nuda hard.

Post, který by si mělo přečíst víc lidí

Osobní pohled na „vydávání nových verzí„, nic pro laiky

P.S.: Asi by to chtělo začít víc psát, abych měl za rok zase co vybrat… ikdyž, já jsem vlastně takový nemluva…

A kdo se ještě přidal?

• Eliška Hutníková – Mých 7 důležitých odkazů #7linkscz
• Větrovka – #7linkscz
• Ivan Kutil – #7linkscz
• Martin Malý – Se7en links cé zet
• Petr Knopp – #7linkscz
• Petr Koubský – Řetězová hra pro bloggery: #7linkscz
• Jan Marcinek – #7linkscz
• Jana Laňková – 7links: 7 nejdůležitějších textů mého života
• Aleš Walter – Příliš vedro na nový obsah, recyklujeme – #7linkscz
• Petr Slavík – #7linkscz: 7 „nej“ článků. Ať je nemusíte dlouho hledat ;)
• Rionka – Jana S. – .nakažlivá bloggerská řetězovka: #7linkscz
• Ondřej Kühn – i já se tedy přidám k #7linkscz
• Milan Kryl – Sedmička zajímavých příspěvků – #7linkscz

Sérii o rychlosti webu plynule nahradím sérií o javascriptovém frameworku jQuery. Nebudu rozebírat důvody, proč je dobré používat framework a už vůbec vám nebudu radit, který je nejlepší. Na to si člověk musí přijít sám ;) Sám jsem nahradil Prototype právě knihovnou jQuery.

Standardní funkce a efekty frameworků se v zásadě od sebe neliší, všude máte nějaké to vyjíždění, zasouvání, zkrácený přístup k elementům přes $(‘#id_elementu’), pohodlnou práci s DOMem a selektory, práce s Javascriptem je pak spíše zábava než práce. Ostatně, příkladů lze na internetu najít čím dál tím víc. Budu tedy střídat základy práce s frameworkem jQuery a užitečnými tipy a návody. Jinak jQuery má super dokumentaci, dobré příklady a rozsáhlé fórum. Tyto odkazy doporučuji v první řadě.

Horké klávesy (hot keys)

Znáte je z desktopových programů, ale čím dál více se začínají dostávat i do web aplikací, ve kterých je pak radost pracovat a bavit se. Klávesové zkratky jsou bezvadným doplňkem „user experience“ a to je v dnešní době obzvlášť důležité. Používáte v Google Docs zkratky? Všechny důležité fungují stejně jako v desktopových kancelářských aplikacích. A co Facebook? Stránkujete obrázky pomocí šipek na klávesnici nebo se snažíte pokaždé trefit myší na „Další“?

A právé teď přichází na scénu jQuery plugin hotkeys, který zvládne všechny zkratky ve všech moderních prohlížečích. Miniverze pluginu má jen 4.4 Kb, takže není třeba se bát stokilových molochů. „Bindování“ zkratek je pak až neskutečně triviální.

Zapínám odchytávání zkratky Ctrl+C (kopírování):

$(document).bind('keydown', 'ctrl+c', fn);

A tady zase vypínám:

$(document).unbind('keydown', 'ctrl+c', fn);

Čekali jste něco víc? Bohužel, je to až takhle jednoduché. Další informace a živé ukázky přímo na stránkách projektu. A ještě jedna ukázka praktického využití tohoto pluginu. U nás ve fotobance Pixmac je stránkování ve výsledcích vyhledávání jednou z nejdůležitějších funkcí. Najít ten pravý obrázek do prezentace nebo na billboard prostě někdy není jednoduché. Maximální komfort tak zaručí náš „Auto result“ a stránkování pomocí šipek na klávesnici. Auto result spočítá maximální možný počet fotek na stránce (z viewportu), takže na malém monitoru dostanete třeba 8 fotek, kdežto na velkém třeba 30. Konec nepohodlného skrolování ;) Pak přichází na řadu přednačítání další stránky v době, kdy prohlížíte fotky na stránce současné. Je to tak směšně prosté a elegantní, že to nikdo z konkurentů nemá. V době kdy prstem mačkáte klávesu „vpravo“ (viz. plugin hotkeys) už jsou náhledy dávno načteny a další stránku dostanete rychleji než bys řek „jQuery“. Předchozí stránka je pak stále schovaná v DOMu a tak stisknutím klávesy „vlevo“ dostanete předchozí výsledek hledání stejně rychle.

Však si to vyzkoušejte na nějakém příjemném tématu – žena v plavkách – a samozřejmě uvítám i kritiku, neb sto očí vidí víc, než jen těch deset našich. Díky ;)

Poslední tip pro rychlejší načítání stránek je spíše otázkou budoucnosti, konkrétně HTML 5. Jednoduchým HTML tagem můžete, až bude mít prohlížeč „dlouhou chvíli“, načíst další potencionální stránku nebo objekt. Funguje to zcela prostě, pro tiché přednačtení celé stránky stačí do hlavičky HTML dokumentu vložit tento tag:

<link rel="next" href="strana-2.html">

Odkaz samozřejmě směřuje na stránku, která logicky následuje – stránkování článků, další stránka fotogalerie, apod. Další možnost je načíst jen jeden objekt dopředu, třeba obrázek:

<link rel="prefetch" href="/fotky/dalsi-fotka.jpg">

Nakonec, Firefox tuto fíčurku již podporuje. Prohlížeče Opera, Safari a Chrome budou tento způsob brzy podporovat, Internet Explorer zhruba za 10 let.

V díle třetím ukážu jednu praktiku, která se hodí pro malé obrázky, typicky třeba ikonky, menší loga apod., kde lze ušetřit 100% HTTP requestů, které jsou největším žroutem času při načítání webu. Technika se jmenuje DATA URIs a podporují ji tyto prohlížeče – Firefox, Safari, Chrome, Internet Explorer od verze 8. Kompletní specifikaci najdete v RFC 2397.

Základním faktem je, že místo URL obrázku zapíšete do „src“ nebo v CSS do“url“ zapíšete toto schéma: data:[<mediatype>][;base64],<data>

Například:

<img src="data:image/gif;base64,R0lGODlhEAAOALMAAOazToeHh0tLS/7LZv/0jvb29t/f3//Ub/
/ge8WSLf/rhf/3kdbW1mxsbP//mf///yH5BAAAAAAALAAAAAAQAA4AAARe8L1Ekyky67QZ1hLnjM5UUde0ECwLJoExKcpp
V0aCcGCmTIHEIUEqjgaORCMxIC6e0CcguWw6aFjsVMkkIr7g77ZKPJjPZqIyd7sJAgVGoEGv2xsBxqNgYPj/gAwXEQA7"
width="16" height="14" alt="Ikona složky">

Výsledkem bude taková hezká ikona, bez jediného HTTP requestu.

Na straně serveru potom musíte toto schéma z obrázku vygenerovat, například podle tohoto článku – http://www.sitepoint.com/blogs/2010/06/05/reducing-http-requests-with-generated-data-uris/ … a rozhodně doporučuji DATA URI kešovat, protože na straně serveru je víc takových operací náročných na paměť. Ale každý ušetřený HTTP požadavek za to stojí! Podívejte se ještě na můj příklad, jak mít stránku bez HTTP požadavků (zjistíte v záložce Síť ve FireBugu).

Příklad stránky s jedním HTTP požadavkem!