JSIO URLs

Posted on by

The clever bit about JSIO is the placeholder URLs – i.e. the “jsio.gif#…” that goes in your image src attributes and background-image CSS properties. Everything after the “#” is the filename of the image that should be displayed. It doesn’t have to be the filename at all, it could just be a single letter or number or symbol or whatever. It doesn’t matter to JSIO. To JSIO, everything after the “#” is just a key into the resources object that holds data uri encoded images. As long as the key is unique (which it will be if you use filenames, since no two files in the same directory can have the same name), JSIO is happy.

Using filenames as keys into our resources object is beneficial to humans. Much more beneficial than coordinates in a sprite, simply because (hopefully) the filenames are meaningful; they describe the image. In comparison to sprites, the JSIO resources object also makes maintaining your image data much easier as it is trivial to add or remove images without having to move other images around within the sprite (and consequently all coordinates referencing your moved image).

Another benefit of using filenames as keys into the JSIO resources object is for fallback. If JSIO detects your browser is IE7 or lower, it’ll strip out “jsio.gif#” leaving just your image key as the image src, which is hopefully a valid URL to the original image. Also, if JSIO detects you’re running IE8 and the image data is larger than 32KB it’ll do the same thing*.

* …but not yet in v1.0.0 alpha

Since the image key is after the “#” (it is the URL “fragment”), your browser won’t send multiple requests for the 1*1px jsio.gif file – it’ll just send one request, cache the response, and use it again. By the way, the jsio.gif image is just a transparent 1*1px gif (for maximum efficiency), but it could be an “spinner” image or something, which is shown temporarily whilst the JSIO resources file is downloaded.

—

This post is about JSIO – JSIO is a tiny library that allows you to make fewer requests to your server by packaging all your site image data in a JavaScript file in data uri format. The official site for JSIO can be found here: jsio.freestyle-developments.co.uk. You can read more about why I started this project here.

6,679 thoughts on “JSIO URLs”

  5. Hey I know this is off topic but I was wondering if you knew of any widgets I
    could add to my blog that automatically tweet my newest twitter updates.
    I’ve been looking for a plug-in like this for quite some time and was hoping
    maybe you would have some experience with something like this.

    Please let me know if you run into anything.

    I truly enjoy reading your blog and I look forward to your new updates.

  6. Hi there to all, the contents existing at this site are in fact awesome for people knowledge,
    well, keep up the nice work fellows.

  8. Пробовал накрутку через дешёвые сервисы — толку не было. Статья помогла понять, почему. Оказывается, я крутил на сырой сайт (не проверил индексацию и позиции в топ-50). Автор даёт чёткий чек-лист перед стартом и объясняет, как проверить, доходят ли клики через Вебмастер. Рекомендую: https://teletype.in/@pfup/3mo6UGVvR2a

  12. Its like you read my mind You appear to know a lot about this like you wrote the book in it or something. I think that you can do with some pics to drive the message home a little bit but other than that this is magnificent blog. A great read. I will certainly be back. гей порно тгк

  18. Федеральный центр банкротства граждан помогает законно списать долги и начать финансовую жизнь с чистого листа. Переходите по запросу центр банкротства физлиц в России. Специалисты сопровождают процедуру на всех этапах: от консультации до полного завершения дела. Индивидуальный подход, прозрачные условия и защита ваших интересов — надежное решение при сложной финансовой ситуации.

  22. Hello! This post couldn’t be written any better! Reading through this
    post reminds me of my old room mate! He always kept chatting about this.

    I will forward this post to him. Fairly certain he will have a good read.
    Many thanks for sharing!

  26. Hi all!

    Looking for a solid gaming platform?

    I recommend Miki — a great option with sports betting included: read reviews here

    VIP rewards. 4.1-star rated on Trustpilot.

    Share your experience below?

  35. цветы через интернет с доставкой цветы через интернет с доставкой .

  38. Hello! I know this is kinda off topic nevertheless I’d figured I’d ask.
    Would you be interested in trading links or maybe guest writing a blog article or vice-versa?
    My website addresses a lot of the same topics as yours and I believe we
    could greatly benefit from each other. If you might
    be interested feel free to send me an e-mail.

    I look forward to hearing from you! Fantastic blog by the way!

  41. Постоянно попадал в кассовые разрывы — деньги вроде есть а платить нечем. Настроил платёжный календарь в программе — теперь вижу заранее где будет дефицит и успеваю подготовиться. управление клиентами CRM

  43. Здравствуйте Лудомания терапия которой включает работу с азартными триггерами и тягой к риску доступна в центре. Центр психологической помощи в Москве MyPsyHealth использует методы предотвращения рецидивов лудомании. Пациенты учатся заполнять пустоту оставшуюся после отказа от ставок новыми увлечениями. Групповая поддержка помогает справиться со стыдом и изоляцией характерными для лудоманов. Верните себе радость от простых жизненных удовольствий без необходимости делать ставки. Полная информация по ссылке – https://mypsyhealth.ru/shop/ вызов невролога на дом провокация после кодирования управление гневом полипрагмазия в психиатрии кардионевроз диагностика бытовой пьянство или болезнь Всего наилучшего и успехов в лечении и здоровье

  47. Ищете надежную юридическую помощь? Рейтинг лучших юристов поможет быстро найти проверенных специалистов с высоким уровнем экспертизы и успешной практикой. Переходите по запросу рейтинг адвокатов в Москве. В подборке — профессионалы, которым доверяют клиенты, с реальными отзывами и подтвержденной репутацией. Выбирайте юриста для решения любых правовых вопросов уверенно и без лишних рисков.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>