📜 ⬆️ ⬇️

Navigator for free icons

Yesterday, once again there was a question on the selection of several icons in the next web project. I mostly use ready-made icons from free kits. Until recently, resorted to the services of the site iconpicker.deviantech.ru. Navigating through the icons, though not the most convenient, was clearly better than just looking through them in the Finder (or Explorer). Recently, however, the site is unavailable.

As a result, I decided to make my own icon navigator:



')
Navigator is an HTML page with javascript code. That is, it works fine being open from a local disk. But for convenience and demonstration laid out online on GitHub'e - sibprogrammer.github.com/icons-explorer

In essence, the interface allows you to view the entire list of icons from several sets (you need when you don’t know what you are looking for) and allows you to filter the set by keyword, leaving only those that satisfy the criteria on the page (when you roughly know what you are looking for).

Sources are located at - github.com/sibprogrammer/icons-explorer For regular viewing, it's easier to download the archive and open index.html to search for icons (GitHub Pages still responds rather slowly to thousands of requests :))

The idea of ​​the navigator has been ripening for a long time, and the inactive site iconpicker.deviantech.ru has only accelerated the process. In practice, it turned out that manipulating 7-odd thousands of icons, even Google Chrome, is rather hard. When you open the page loads only those icons that are visible at the moment. To do this, use the plugin for jQuery LazyLoad. Unfortunately, its performance on such volumes was insufficient and had to spend some time improving in terms of speed. As a result, the page scrolling stopped permanently slowing down, but only thinking periodically. Although the system requirements for the client is still quite high. Sprites could significantly improve the situation, but their generation is a separate issue that was postponed for the future.

Navigator was made primarily to satisfy your own needs. But I think it will be useful to other developers.

Source: https://habr.com/ru/post/138762/


All Articles