{"id":21887,"date":"2014-05-30T09:30:38","date_gmt":"2014-05-30T07:30:38","guid":{"rendered":"https:\/\/mamchenkov.net\/wordpress\/?p=21887"},"modified":"2014-05-30T09:30:38","modified_gmt":"2014-05-30T07:30:38","slug":"jsaction-a-tiny-event-delegation-library","status":"publish","type":"post","link":"https:\/\/mamchenkov.net\/wordpress\/2014\/05\/30\/jsaction-a-tiny-event-delegation-library\/","title":{"rendered":"JsAction – a tiny event delegation library"},"content":{"rendered":"\n

JsAction<\/a> – a tiny event delegation library<\/p>\n

JsAction is a tiny event delegation library that allows decoupling the DOM nodes on which the action occurs from the JavaScript code that handles the action.<\/p>\n

The traditional way of adding an event handler is to obtain a reference to the node and add the event handler to it. JsAction allows us to map between events and names of handlers for these events via a custom HTML attribute called jsaction<\/em>.<\/p>\n

Separately, JavaScript code registers event handlers with given names which need not be exposed globally. When an event occurs the name of the action is mapped to the corresponding handler which is executed.<\/p>\n

Finally, JsAction uncouples event handling from actual implementations. Thus one may late load the implementations, while the app is always able to respond to user actions marked up through JsAction. This can help in greatly reducing page load time, in particular for server side rendered apps.<\/p><\/blockquote>\n\n","protected":false},"excerpt":{"rendered":"\n

JsAction – a tiny event delegation library JsAction is a tiny event delegation library that allows decoupling the DOM nodes on which the action occurs from the JavaScript code that handles the action. The traditional way of adding an event handler is to obtain a reference to the node and add the event handler to … Continue reading JsAction – a tiny event delegation library<\/span><\/a><\/p>\n\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"link","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2},"_links_to":"","_links_to_target":""},"categories":[1,18,62,1334],"tags":[1139,1330],"keyring_services":[],"class_list":["post-21887","post","type-post","status-publish","format-link","hentry","category-general","category-programming","category-technology","category-web-work","tag-javascript","tag-web-development","post_format-post-format-link"],"aioseo_notices":[],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack-related-posts":[{"id":21696,"url":"https:\/\/mamchenkov.net\/wordpress\/2014\/04\/24\/raphael-javascript-library-for-working-with-vector-images\/","url_meta":{"origin":21887,"position":0},"title":"Rapha\u00ebl – JavaScript library for working with vector images","author":"Leonid Mamchenkov","date":"April 24, 2014","format":"link","excerpt":"Rapha\u00ebl - JavaScript library for working with vector images. Rapha\u00ebl is a small JavaScript library that should simplify your work with vector graphics on the web. If you want to create your own specific chart or image crop and rotate widget, for example, you can achieve it simply and easily\u2026","rel":"","context":"In "All"","block_context":{"text":"All","link":"https:\/\/mamchenkov.net\/wordpress\/category\/general\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":22179,"url":"https:\/\/mamchenkov.net\/wordpress\/2014\/07\/12\/sentry-an-event-logging-platform-focused-on-capturing-and-aggregating-exceptions\/","url_meta":{"origin":21887,"position":1},"title":"Sentry – an event logging platform focused on capturing and aggregating exceptions","author":"Leonid Mamchenkov","date":"July 12, 2014","format":"link","excerpt":"Sentry - an event logging platform focused on capturing and aggregating exceptions. \u00a0Most of the code is Open Source (except for a few proprietary plugins), in case you want to run your own hosted version. Supports Ruby, Python, JavaScript, Java, Rails, Django, PHP, iOS, node.js, .NET, and more.","rel":"","context":"In "All"","block_context":{"text":"All","link":"https:\/\/mamchenkov.net\/wordpress\/category\/general\/"},"img":{"alt_text":"sentry","src":"https:\/\/i0.wp.com\/mamchenkov.net\/wordpress\/wp-content\/uploads\/2014\/07\/sentry-500x182.png?resize=350%2C200&ssl=1","width":350,"height":200},"classes":[]},{"id":28237,"url":"https:\/\/mamchenkov.net\/wordpress\/2017\/11\/21\/rrule-will-make-you-hate-calendars\/","url_meta":{"origin":21887,"position":2},"title":"RRULE will make you hate calendars","author":"Leonid Mamchenkov","date":"November 21, 2017","format":false,"excerpt":"Calendars are not the simplest applications by far.\u00a0 There are many different features, lots of different implementations, multitude of standards (just a few being RFC 2445, which was obsoleted by RFC 5545, which was updated by RFC 5546, RFC 6868, RFC 7529, RFC 7953, RFC 7986) , and plenty of\u2026","rel":"","context":"In "All"","block_context":{"text":"All","link":"https:\/\/mamchenkov.net\/wordpress\/category\/general\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/mamchenkov.net\/wordpress\/wp-content\/uploads\/2017\/11\/rrule-500x243.png?resize=350%2C200&ssl=1","width":350,"height":200},"classes":[]},{"id":28618,"url":"https:\/\/mamchenkov.net\/wordpress\/2018\/06\/10\/capture-and-report-javascript-errors-with-window-onerror\/","url_meta":{"origin":21887,"position":3},"title":"Capture and Report JavaScript Errors with window.onerror","author":"Leonid Mamchenkov","date":"June 10, 2018","format":false,"excerpt":"\"Capture and Report JavaScript Errors with window.onerror\" tutorial shows an easy way to capture, log and troubleshoot client-side errors: onerror\u00a0is a special browser event that fires whenever an uncaught\u00a0JavaScript errorhas been thrown. It's one of the easiest ways to log client-side errors and report them to your servers. It's also\u2026","rel":"","context":"In "All"","block_context":{"text":"All","link":"https:\/\/mamchenkov.net\/wordpress\/category\/general\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":42426,"url":"https:\/\/mamchenkov.net\/wordpress\/2019\/04\/09\/chrome-extensions-php-console-and-javascript-errors-notifier\/","url_meta":{"origin":21887,"position":4},"title":"Chrome Extensions: PHP Console and JavaScript Errors Notifier","author":"Leonid Mamchenkov","date":"April 9, 2019","format":false,"excerpt":"Here are a couple of handy Google Chrome extensions that I came across the other day. PHP Console PHP Console can display PHP errors and var dumps in the Google Chrome Developer Console and notification popups. It can also execute PHP code remotely, with the help of this server side\u2026","rel":"","context":"In "All"","block_context":{"text":"All","link":"https:\/\/mamchenkov.net\/wordpress\/category\/general\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/mamchenkov.net\/wordpress\/wp-content\/uploads\/2019\/04\/javascript-error-notifier.png?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/mamchenkov.net\/wordpress\/wp-content\/uploads\/2019\/04\/javascript-error-notifier.png?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/mamchenkov.net\/wordpress\/wp-content\/uploads\/2019\/04\/javascript-error-notifier.png?resize=525%2C300&ssl=1 1.5x"},"classes":[]},{"id":23274,"url":"https:\/\/mamchenkov.net\/wordpress\/2015\/01\/07\/snabbt-js-minimalistic-animation-library-in-javascript\/","url_meta":{"origin":21887,"position":5},"title":"snabbt.js – minimalistic animation library in JavaScript","author":"Leonid Mamchenkov","date":"January 7, 2015","format":"link","excerpt":"snabbt.js - minimalistic animation library in JavaScript","rel":"","context":"In "All"","block_context":{"text":"All","link":"https:\/\/mamchenkov.net\/wordpress\/category\/general\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"jetpack_sharing_enabled":true,"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/mamchenkov.net\/wordpress\/wp-json\/wp\/v2\/posts\/21887","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mamchenkov.net\/wordpress\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mamchenkov.net\/wordpress\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mamchenkov.net\/wordpress\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/mamchenkov.net\/wordpress\/wp-json\/wp\/v2\/comments?post=21887"}],"version-history":[{"count":0,"href":"https:\/\/mamchenkov.net\/wordpress\/wp-json\/wp\/v2\/posts\/21887\/revisions"}],"wp:attachment":[{"href":"https:\/\/mamchenkov.net\/wordpress\/wp-json\/wp\/v2\/media?parent=21887"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mamchenkov.net\/wordpress\/wp-json\/wp\/v2\/categories?post=21887"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mamchenkov.net\/wordpress\/wp-json\/wp\/v2\/tags?post=21887"},{"taxonomy":"keyring_services","embeddable":true,"href":"https:\/\/mamchenkov.net\/wordpress\/wp-json\/wp\/v2\/keyring_services?post=21887"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}