10K Apart. My answer

    Together with the rest I will tell my story about how I wrote 10kB of application and sent two works to the competition. Let's start in order ...
    Perhaps the most difficult is to come up with an interesting idea.
    Initially, I wanted to create an application, not a game. Initially, I wanted to do what I can use later (at least as software developments, if not applications).
    The first idea was TODO - stickers with a couple of interesting features, but because of the huge number of TODO applications I didn’t do it (from a height of 20kB of written code - it’s not a fact that all the planned features would fit in 10kB).
    So the first application:

    Css3 customization.


    Then I had a desire to use canvas for the controller. First of all, I wanted to create a rotating controller.

    Without canvas, this is not easy. The controller must control something) And that was the div. The next canvas controller was the slider (after all, no one likes that the controller consists of more than one DOM element ..).

    Most of all, of course, I was busy with color grading ...

    Actually, I cheated a little. Some applications consist entirely of a controller for selecting colors. I can’t focus the controller by the color value. Color is selected unilaterally - so I saved kilobytes ...
    Because in canvas, it’s not possible to control painted “shapes”, controllers respond to the mousemove event, and when they are clicked, they retain their position. It turned out pretty funny (at least in my opinion). The controls are comfortable: nothing jumps / stands out / drags.
    When everything was ready, I decided to work on the design of the page. As a result, a rotated rectangle appeared on the background of the controllers, and I made the retractable style panel stick out from the side.
    After publication, I began to look at other works, and my attention was drawn to the feeder 10k.aneventapart.com/Entry/127 and I wanted to do something useful ..) The

    second application was

    Special bookmarks.


    I planned to make bookmarks with the ability to search pages, assuming that there is such a function in the search engine api. But later it turned out that it wasn’t ... nevertheless, there is a domain search function. In general, all this became unimportant afterwards, when the application was fun 11kB).
    I presented the folders in the form of rotated blocks as soon as I decided to make bookmarks.

    And I made the bookmarks like this:

    I managed to make the parser of the chrome and fox bookmark files. In Mozilla, you can work with files locally. In chrome, just copying the text. Bookmarks are moved by drag and drop. You can search using regular expressions. Matches are highlighted.

    In general, with Internet search, and some more functionality (for example, tying up synchronization with some bookmarking services), I will use this application myself :), and during the competition I improved my writing js code skills pretty well.
    To compress js, I used closure-compiler.appspot.com/home
    To compress css - the first css compressor that came across.
    But I didn’t really like to shorten the names of the classes and methods of the object ... but I need to ... I just did not put quotation marks in the tags, I tried to shorten everything that was possible.

    Also popular now: