Πέρυσι κυκλοφόρησε η Google WebM ως εναλλακτική λύση στο βίντεο με κωδικοποίηση h264. Το ακολούθησαν με την απελευθέρωση του WebP ως εναλλακτική λύση στο JPG. Από τότε που κυκλοφόρησε, σκέφτομαι να το δοκιμάσω στο iOS για να δω πόσο καλά μπορεί να λειτουργήσει για τη μείωση του μεγέθους της εφαρμογής. Ως μπόνους για μειωμένο μέγεθος, το WebP υποστηρίζει επίσης ένα κανάλι άλφα που δεν υποστηρίζει το JPG (υπάρχουν περισσότερες διαθέσιμες πληροφορίες στο πρωτότυπο ελευθέρωση ανάρτηση).
Για να ακολουθήσετε, θα χρειαστεί να πάρετε την πηγή για το WebP και να την μεταγλωττίσετε. Ο ευκολότερος τρόπος για να το κάνετε αυτό είναι να ακολουθήσετε τον επίσημο μεταγλώττιση WebP οδηγίες. Μετά τη μεταγλώττιση της πηγής, θα μπορείτε να κωδικοποιήσετε εικόνες WebP, αργότερα θα περιγράψω πώς να δημιουργήσετε την ίδια πηγή για χρήση με το iOS.
Πριν προσπαθήσω να δημιουργήσω μια ιστοσελίδα, έκανα μερικές δοκιμές για να δω πόσο εύκολος είναι ο χειρισμός φιλοξενία wordpress για να προσθέσετε φωτογραφίες και βίντεο σε αναρτήσεις ιστολογίου. Χρησιμοποίησα το ImageMagick για να μετατρέψω τις εικόνες πηγής σε JPG και μείωσα την ποιότητα του JPG όσο φαινόταν λογικό για να μειώσω το μέγεθος που προκύπτει. Δοκίμασα διάφορους συνδυασμούς αλλά κατέληξα να χρησιμοποιήσω την ακόλουθη εντολή για να μετατρέψω τα JPG:
convert -quality 75 -resize 1024x680 inputfile.png outputfile.jpg
Ακολουθούν μερικά δείγματα που παράγονται χρησιμοποιώντας αυτήν την εντολή:
Για το WebP έκανα την ποιότητα 90 και κωδικοποίησα τις ίδιες εικόνες με την ακόλουθη εντολή:
cwebp -q 90 -resize 1024 680 inputfile.png -o outputfile.webp
Ακολουθούν μερικά παραδείγματα εικόνων που παράγονται χρησιμοποιώντας αυτήν την εντολή (κατά τη στιγμή αυτής της ανάρτησης θα είναι ορατές μόνο μέσω του Chrome):
Ακόμη και με το πλεονέκτημα που έδινα στις εικόνες JPG συμπιέζοντάς τις με χαμηλότερη ποιότητα, κατάφερα να πετύχω μείωση μεγέθους 25% στην έκδοση WebP. Γενικά οι εικόνες JPG θα μπορούσαν να χρησιμοποιηθούν, αλλά μερικές κατέληξαν με τεχνουργήματα που θα απαιτούσαν την εκ νέου κωδικοποίησή τους σε υψηλότερη ποιότητα. Οι εκδόσεις WebP κατέληξαν να φαίνονται καλύτερες σε κάθε περίπτωση.
Αυτή ήταν απλώς η γρήγορη προσπάθειά μου να επαληθεύσω ότι θα άξιζε τον κόπο να χρησιμοποιήσω το WebP. Μια πιο αναλυτική επισκόπηση του JPG έναντι του WebP μπορείτε να βρείτε στο παράδειγμα γκαλερί.
Με αυτό το απλό τεστ δημιούργησα ένα σενάριο που θα μεταγλωττίσει την πηγή libwebp σε ένα πλαίσιο συμβατό με τους προσομοιωτές iOS, το iPad και το iPhone:
SDK=4.3
PLATFORMS="iPhoneSimulator iPhoneOS-V6 iPhoneOS-V7"
DEVELOPER=/Developer
TOPDIR=`pwd`
BUILDDIR="$TOPDIR/tmp"
FINALDIR="$TOPDIR/WebP.framework"
LIBLIST=''
mkdir -p $BUILDDIR
mkdir -p $FINALDIR
mkdir $FINALDIR/Headers/
for PLATFORM in ${PLATFORMS}
do
if [ "${PLATFORM}" == "iPhoneOS-V7" ]
then
PLATFORM="iPhoneOS"
ARCH="armv7"
elif [ "${PLATFORM}" == "iPhoneOS-V6" ]
then
PLATFORM="iPhoneOS"
ARCH="armv6"
else
ARCH="i386"
fi
ROOTDIR="${BUILDDIR}/${PLATFORM}-${SDK}-${ARCH}"
rm -rf "${ROOTDIR}"
mkdir -p "${ROOTDIR}"
export DEVROOT="${DEVELOPER}/Platforms/${PLATFORM}.platform/Developer"
export SDKROOT="${DEVROOT}/SDKs/${PLATFORM}${SDK}.sdk"
export CC=${DEVROOT}/usr/bin/gcc
export LD=${DEVROOT}/usr/bin/ld
export CPP=${DEVROOT}/usr/bin/cpp
export CXX=${DEVROOT}/usr/bin/g++
export AR=${DEVROOT}/usr/bin/ar
export AS=${DEVROOT}/usr/bin/as
export NM=${DEVROOT}/usr/bin/nm
export CXXCPP=$DEVROOT/usr/bin/cpp
export RANLIB=$DEVROOT/usr/bin/ranlib
export LDFLAGS="-arch ${ARCH} -pipe -no-cpp-precomp -isysroot ${SDKROOT} -L${ROOTDIR}/lib"
export CFLAGS="-arch ${ARCH} -pipe -no-cpp-precomp -isysroot ${SDKROOT} -I${ROOTDIR}/include"
export CXXFLAGS="-arch ${ARCH} -pipe -no-cpp-precomp -isysroot ${SDKROOT} -I${ROOTDIR}/include"
rm -rf libwebp-0.1.2
tar xzf libwebp-0.1.2.tar.gz
cd libwebp-0.1.2
sh autogen.sh
./configure --host=${ARCH}-apple-darwin --prefix=${ROOTDIR} --disable-shared --enable-static
make
make install
LIBLIST="${LIBLIST} ${ROOTDIR}/lib/libwebp.a"
cp -Rp ${ROOTDIR}/include/webp/* $FINALDIR/Headers/
cd ..
done
${DEVROOT}/usr/bin/lipo -create $LIBLIST -output $FINALDIR/WebP
rm -rf libwebp-0.1.2
rm -rf ${BUILDDIR}
Το σενάριο υποθέτει ότι η πηγή για το libwebp βρίσκεται στον ίδιο κατάλογο από τον οποίο εκτελείται το σενάριο. Εάν παραλείψατε το πρώτο μέρος της ανάρτησης ή θέλετε να βεβαιωθείτε ότι χρησιμοποιείτε την ίδια έκδοση που χρησιμοποίησα, χρησιμοποιήστε την ακόλουθη εντολή curl:
curl http://webp.googlecode.com/files/libwebp-0.1.2.tar.gz > libwebp-0.1.2.tar.gz
Αφού εκτελέσετε το σενάριο, θα έχετε έναν κατάλογο WebP.framework που αντιπροσωπεύει τη βιβλιοθήκη. Μπορείτε να το χρησιμοποιήσετε ως πλαίσιο στο XCode.
Η χρήση της βιβλιοθήκης είναι εύκολη. Το ακόλουθο απόσπασμα δείχνει πώς μπορείτε να αποκτήσετε την τρέχουσα έκδοση της βιβλιοθήκης WebP, να λάβετε το πλάτος και το ύψος μιας εικόνας και, στη συνέχεια, να διαβάσετε την εικόνα σε ένα buffer:
// Get the current version of the WebP decoder int rc = WebPGetDecoderVersion(); NSLog(@"Version: %d", rc); // Get the width and height of the selected WebP image int width = 0; int height = 0; WebPGetInfo([myData bytes], [myData length], &width, &height); NSLog(@"Image Width: %d Image Height: %d", width, height); // Decode the WebP image data into a RGBA value array uint8_t *data = WebPDecodeRGBA([myData bytes], [myData length], &width, &height);
Υπάρχει περισσότερη τεκμηρίωση για το WebP API και έχω συγκεντρώσει ένα πλήρες παράδειγμα στο Github. Αν αρπάξεις το Παράδειγμα WebP iOS από το Github θα βρείτε το σενάριο κατασκευής καθώς και το πλήρες παράδειγμα. Πρώτα δημιουργήστε τη βιβλιοθήκη από μια γραμμή εντολών και στη συνέχεια ανοίξτε το παράδειγμα έργου στο XCode. Εάν δεν δημιουργήσετε πρώτα τη βιβλιοθήκη πριν ανοίξετε το έργο, θα δείτε ότι λείπει το WebP.framework.
Σε αυτό το σημείο βρίσκεστε στο δρόμο για να αποκτήσετε μικρότερες εφαρμογές iOS. Υπάρχει τουλάχιστον ένα μειονέκτημα σε αυτό το σημείο και αυτό είναι η ταχύτητα. Η αποκωδικοποίηση είναι λίγο αργή και νομίζω ότι αυτό οφείλεται στο ότι η βιβλιοθήκη δεν έχει κατασκευαστεί για να εκμεταλλεύεται οποιαδήποτε επιτάχυνση υλικού. Το επόμενο βήμα είναι να δούμε αν μπορεί να επιταχυνθεί χρησιμοποιώντας το πλαίσιο επιτάχυνσης.
