05Aug Load content while scrolling with Prototype and JSON-P via Yahoo API
Today I’d like to present my solution for loading content while scrolling down the page in the DZone style using PrototypeJS library.
Check out simple DEMO »
Demo was tested in Firefox, Chrome, IE7/8 and Opera.
I used Yahoo Local Search API as a JSON data source for keyword kitesurfing.
Here is simple table where data will be put.
<body id="body">
<table id="table-scroll">
<tr><th>Name</th><th>Address</th><th>City</th></tr>
<tbody id="result"></tbody>
</table>
<div id="loader">
<img src="loader.gif" />
</div>
</body>
20Jul Twitter API: Stream of messages for query with PHP, JSON and Prototype
Last week Antonio Lupetti presented on his blog turorial on Twitter API: How to create a stream of messages Monitter-like with PHP and jQuery.
I would like to present how I did such widget using PrototypeJS and JSON.
I left html and css unchanged and you can CHECK OUT DEMO HERE.
I used JSON-PHP library to convert $results list of objects into JSON.
search.php
< ?
header('Content-type: application/json');
//Set header to application/json to easily read JSON in javascript
require_once "lib/twitterapi.php";
require_once "lib/JSON.php";
if($_POST['twitterq']){
$twitter_query= $_POST['twitterq'];
$search = new TwitterSearch($twitter_query);
$results = $search->results();
foreach($results as $result){
$result->text=toLink($result->text);
}
$json = new Services_JSON();
echo $json->encode($results);
}
?>
07Jul Konkurencja najnowszych przeglądarek: Firefox 3.5, IE 8, Chrome 3, Opera 10 i Safari 4
Pierwsza połowa tego roku przyniosła najnowsze wersje różnych przeglądarek. W końcu zaczyna być widać, że konkurencja między Firefox 3.5, IE8 i chociażby Chrome 3 przynosi efekty w postaci długo oczekiwanych zmian dla użytkowników i twórców stron.
Poza tym, że wyniki testu Acid3 są coraz lepsze, to pojawiło się parę nowych funkcjonalności, które zostały zaimplementowane przynajmniej w kilku z nich. Omówię funkcjonalności, które wpływają na prędkość ładowania stron oraz pozwalają na lepsze wykorzystanie JavaScriptu.
Proces w zakładce
Przeglądarki zaczęły rozdzielać poszczególne zakładki na osobne procesy. Skutkuje to szybszym przeglądaniem, ponieważ strony są przetwarzane równolegle w tym samym czasie. Dodatkowo, błąd na jednej zakładce nie powoduje zamknięcia całej przeglądarki, ale tylko jednego procesu.
Programiści IE 8 też dali radę to osiągnąć i tworzą dobrze widoczny proces iexplorer.exe dla każdej zakładki.
24Jun Szybkie iteracje czyli przyspieszanie pętli
We wpisie Wydajne tworzenie elementów DOM C.D. pisałem o szybkim sposobie tworzenia elementów DOM w pętli. Zainspirowany częścią prezentacji Nicholasa Zakasa Speed Up Your JavaScript dotyczącą pętli przedstawie sposoby wydajnego iterowania po elementach.
Specyfikacja ecma-262, 3. edycja z grudnia 1999 roku wprowadza cztery rodzaje pętli: for, do-while, while oraz for-in.
Trzy pierwsze pętle służą do iteracji po listach, których klucze są kolejnymi liczbami całkowitymi zaczynając od 0.
For-in natomiast jest stworzony do przebiegania po tablicach asocjacyjnych, których klucze są łańcuchami znakowymi. Konstrukcja:
for (var key in arr) {
arr[key];
}
w zmiennej key zwraca klucz i nie będę jej omawiać ze względu na niską wydajność.
Co jest ważne?
Dwa najważniejsze czynniki wpływające na prędkość pętli do ilość operacji w każdym przebiegu oraz liczba iteracji.
(more…)
