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,960 thoughts on “JSIO URLs”

  2. Доброго Проблемы на производстве? Мы гарантируем быстрое решение Р’С‹ можете РЅРµ переживать Р·Р° поломки если будете работать СЃ нами. РњС‹ предлагаем вам надежное обслуживание которое включает РЅРµ только ремонт РЅРѕ Рё профилактику. РњС‹ выявляем скрытые СѓРіСЂРѕР·С‹ Рё устраняем РёС… РґРѕ того как РѕРЅРё РјРѕРіСѓС‚ повлиять РЅР° вашу работу. РЎ помощью наших решений ваше оборудование будет работать бесперебойно Р° РІС‹ забудете Рѕ неожиданных поломках. Полная информация по ссылке – https://dag-techservice.ru/services/electrical.html электротехническое оборудование сервисное обслуживание компрессорная станция обслуживание РґРѕРіРѕРІРѕСЂ обслуживания противопожарного оборудования пресс гидравлический ремонт Автоматическая линия фасовки цемента — кейс DAG TechService монтаж промышленного котельного оборудования Удачи и комфорта в жизни Ваши устройства на постоянном обслуживании — мы всегда рядом 7ef1635

  7. Юрист по заключению брака поможет оформить отношения быстро и без ошибок. Переходите по запросу юрист по оформлению брака. Проконсультируем по всем вопросам регистрации, подготовим документы, сопроводим при заключении брака, включая случаи с иностранными гражданами. Обеспечим соблюдение всех требований законодательства и защиту ваших интересов. Экономьте время и избегайте рисков — доверьте оформление профессионалам.

  14. Всем любителям кино открыл для себя удобную платформу смотреть кино онлайн — KinoStart. Каждый фильм на KinoStart — это отдельная история ждущая вас. Смотрите фильмы онлайн и погружайтесь в мир приключений. фильмы онлайн бесплатно От исторических драм до фантастических блокбастеров. Выбирайте настроение и смотрите. Загляните сюда: — https://www.kinostart-1.top смотреть фильмы онлайн легальноприключения смотреть онлайнфильмы онлайн бесплатно без регистрации Наслаждайтесь кино на KinoStart

  21. Hello folks I came across a 167 useful resource that I think you should visit. This site is packed with a lot of useful information that you might find valuable. It has everything you could possibly need so be sure to give it a visit https://underscoopfire.com/the-rise-of-retro-gaming-cafes-how-nostalgia-is-reshaping-social-spaces-for-gamers/ And dont overlook guys — you at all times can in the article discover responses to address your most tangled queries. We made an effort to explain the complete information using the very accessible way.

  25. Металлочерепица с полиуретановым покрытием и гарантией 50 лет. Замок 90 мм отводит влагу при уклоне от 14 градусов. Большая палитра оттенков нашёл под любой фасад. металлочерепица цена Красноярск

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

  28. Hello there! I could have sworn I’ve been to this blog before but after browsing through
    a few of the posts I realized it’s new how to play live baccarat
    (Angie) me. Anyhow,
    I’m certainly pleased I stumbled upon it and I’ll be bookmarking it and checking back frequently!

  38. Коллеги, хороший обзорный материал по SEO и интернет-маркетингу в 2026 году. Автор разбирает тренды: приоритет естественного языка и длинных запросов, рост значимости голосового поиска, учёт поведенческих факторов. Есть пошаговый план выстраивания стратегии и список метрик для отслеживания (CAC, ROI, время на сайте). Полезно для систематизации: https://vlcjq.ru/prodvizhenie-sajtov-seo-i-internet-marketing-v-2026-godu/

  42. I’m curious to find out what blog platform you’re using?
    I’m experiencing some minor security issues with my latest blog and I’d like to find
    something more safe. Do you have any suggestions?

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>