tags: JavaScript

Action executed in 0.000

Each Tag

JavaScript

Common tags - number of posts

presentation (5), slide (5), profile (2), HTML (2), call graph (2), web (2), dot (2), CSS (2), map (1), promises (1), DOM (1), CSS3 (1), framework (1), prototype (1), all (1), O'Reilly (1), Mozilla (1), OOP (1), MVC (1), open source (1), async (1), blocking (1), cachegrind (1), conference (1), features (1), developer (1), inheritance (1), loading (1), promise (1), Google (1), knex (1), development (1), geek (1), ECMAScript (1), comparison (1), performance (1), blog (1), menu (1), defer (1), verify (1), class (1), SPA (1), series (1), deck (1), web design (1), 6 (1), GIS (1), HTML5 (1), diff (1), crockford (1),

2 way join

JavaScript, call graph, CSS, JavaScript, JavaScript, dot, HTML, JavaScript, JavaScript, presentation, JavaScript, profile, JavaScript, slide, JavaScript, web

3 way join

JavaScript, call graph, dot, JavaScript, call graph, profile, CSS, HTML, JavaScript, JavaScript, dot, profile, JavaScript, presentation, slide

4 way join

JavaScript, call graph, dot, profile

●●●●●●●○

JavaScript Promises: an Introduction  |  Web  |  Google Developers

Jake Archibald

JavaScript is single threaded, meaning that two bits of script cannot run at the same time; they have to run one after another. In browsers, JavaScript shares a thread with a load of other stuff that differs from browser to browser. But typically JavaScript is in the same queue as painting, updating styles, and handling user actions (such as highlighting text and interacting with form controls). Activity in one of these things delays the others.

url: https://developers.google.com/web/fundamentals/getting-started/primers/promises

type: article, format: page

●●●●●○○○

Edward Bramanti - Are you serial, Promise.all?

bcd-alt-text

About a month ago, I came across an interesting problem at work where a database migration with Knex was not working properly. An example similar to the actual problem is shown below:

The first promise renames a table from tomatoes to potatoes. The following promise adds the string column name to the newly renamed table potatoes. While there may seem to be nothing wrong here, this code resulted in an error, saying the table potatoes did not exist.

url: https://bramanti.me/are-you-serial-promise-all/

type: article, format: blog

●●●●●○○○

Prototypal Object-Oriented Programming using JavaScript · An A List Apart Article

wallet

Douglas Crockford accurately described JavaScript as the world’s most misunderstood language. A lot of programmers tend to think of it as not a “proper” language because it lacks the common object-oriented programming concepts. I myself developed the same opinion after my first JavaScript project ended up a hodgepodge, as I couldn’t find a way to organize code into classes. But as we will see, JavaScript comes packed with a rich system of object-oriented...

url: http://alistapart.com/article/prototypal-object-oriented-programming-using-javascript

type: article, format: blog

●●●●●○○○

Deep dive into the murky waters of script loading - HTML5 Rocks

Jake Archibald

In this article I’m going to teach you how to load some JavaScript in the browser and execute it.

No, wait, come back! I know it sounds mundane and simple, but remember, this is happening in the browser where the theoretically simple becomes a legacy-driven quirk-hole. Knowing these quirks lets you pick the fastest, least disruptive way to load scripts. If you’re on a tight schedule, skip to the quick reference.

url: http://www.html5rocks.com/en/tutorials/speed/script-loading/

type: article, format: blog

●●●●●○○○

JavaScript, HTML5, CSS3 Conference - O'Reilly Fluent

O'Reilly Fluent Conference Practical training in JavaScript, HTML5, CSS, and the latest web development technologies and frameworks.

url: http://conferences.oreilly.com/fluent/

type: none, format: none

●●●●●○○○

David Walsh Blog - JavaScript Consultant

My name is David Walsh. I'm a 31-year old web developer and software engineer from Madison, Wisconsin. In the web world I'm:

My expertise and interest lies in front-end technologies, including HTML/5, CSS, JavaScript (as well as frameworks like jQuery, MooTools, and Dojo Toolkit). My server side skills revolve around PHP and Python. I enjoy dabbling in mobile development and edge devices and environments. I focus on open source contributing...

url: https://davidwalsh.name/

type: person, format: blog

●●●●●○○○

GitHub - jlfwong/chrome2calltree: Convert CPU profiles exported from Chrome to callgrind format

uwflow.com example

Convert CPU profiles exported from Chrome to callgrind format.

This is only useful if you have KCacheGrind or QCacheGrind installed.

Collect a Chrome CPU profile either by using console.profile() or by clicking buttons in the Developer Tools. Save the profile somewhere to disk.

Assuming you have KCacheGrind or QCacheGrind installed, you can then load your CPU profile using chrome2calltree. Note that it might open in the backgr...

url: https://github.com/jlfwong/chrome2calltree

type: project, format: none

●●●●●○○○

GitHub - scottrogowski/code2flow: Turn your Python and Javascript code into DOT flowcharts

call graph Turn your Python and Javascript source code into DOT flowcharts Code2flow will sweep through your project source code looking for function definitions. Then it will do another sweep looking for where those functions are called. Code2flow connects the dots and presents you with a flowchart estimating the functional structure of your program. In other words, code2flow generates callgraphs

url: https://github.com/scottrogowski/code2flow

type: project, format: none

●●●●●○○○

tmcw/biggie · GitHub

@tmcw

biggie is the last mile of big. It turns Markdown into slides, and slides into a website, and even posts it online for you with the magic of bl.ocks.org and Gist.

You can use biggie basically from the command line as an npm module:

Pipe it into browser or bcat to just view it in a browser immediately.

url: https://github.com/tmcw/biggie

type: project, format: none

●●●●●○○○

vzvenyach/htmldecks · GitHub

@vzvenyach

HTMLDecks is markdown with slides separated by ---. For example:

Once you're done editing the slides, create the deck and start presenting. Simply as that.

In presentation mode, by pressing escape, you'll be able to access a menu to return to editing or prepare the slides for printing in PDF.

url: https://github.com/vzvenyach/htmldecks

type: project, format: none

●●●●●○○○

reveal.js - The HTML Presentation Framework

reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do.

Nested slides are useful for adding additional detail underneath a high level horizontal slide.

url: http://lab.hakim.se/reveal-js/#/

type: project, format: none

●●●●●○○○

deck.js » Modern HTML Presentations

The deck.core module keeps track of slide states and deck states, leaving CSS to define what each state look like…

Extensions use core events and methods to add goodies, giving presenters the freedom to add what they want and leave out what they don’t.

url: http://imakewebthings.com/deck.js/

type: project, format: none

●●●●●○○○

lukehoban/es6features · GitHub

@lukehoban

ECMAScript 6, also known as ECMAScript 2015, is the latest version of the ECMAScript standard. ES6 is a significant update to the language, and the first update to the language since ES5 was standardized in 2009. Implementation of these features in major JavaScript engines is underway now.

See the ES6 standard for full specification of the ECMAScript 6 language.

url: https://github.com/lukehoban/es6features

type: project, format: page

●●●●●○○○

Important Considerations When Building Single Page Web Apps

framework spectrum Single page web applications - or SPAs, as they are commonly referred to - are quickly becoming the de facto standard for web app development. The fact that a major part of the app runs inside a single web page makes it very interesting and appealing, and the accelerated growth of browser capabilities pushes us closer to the day, when all apps run entirely in the browser.

url: http://code.tutsplus.com/tutorials/important-considerations-when-building-single-page-web-apps--net-29356

type: article, format: blog

●●●●●○○○

mbostock/stack.js

A presentation library with intuitive, scroll-based navigation. — https://mbostock.github.io/stack/

url: https://github.com/mbostock/stack

type: project, format: page

●●●●●○○○

5 Lava lamp / Fancy menu navigations

tags: menu, JavaScript
lavalamp for YUI

The Lava Lamp menu aka. Fancy menu, rivals flash with it’s nifty effect. It was originally witten by Guillermo Rauch for mootools javascript library and later on was ported to most popular javascript libraries.

url: http://www.net-kit.com/5-lava-lamp-fancy-menu-navigations/

type: article, format: blog

●●●●●○○○

magnetiq.com

Magnetiq logo

Ates Goral’s Personal Playground and Project Repository

url: http://magnetiq.com/

type: article, format: blog

●●●●●○○○

OpenLayers: Home

tags: GIS, JavaScript
OpenLayers logo OpenLayers makes it easy to put a dynamic map in any web page. It can display map tiles and markers loaded from any source. MetaCarta developed the initial version of OpenLayers and gave it to the public to further the use of geographic information of all kinds. OpenLayers is completely free, Open Source JavaScript, released under a BSD-style License.

url: http://openlayers.org/

type: project, format: page

●●●●●●●○

JSLint, The JavaScript Verifier

javascript verifier, looks for problems in JavaScript programs

url: http://www.jslint.org

type: project, format: unknown

●●●●●●○○

Jack of All Trades Web Development

tags: CSS, HTML, JavaScript
Marc Grabanski is a professional web developer out of Minneapolis, Minnesota. He is currently consulting during part of his week, leaving the rest of the week for developing his own web applications.

url: http://marcgrabanski.com/

type: person, format: unknown

Groking the Google Map

My current project at work has me drawing maps. So when a colleague sent me an interesting "article" regarding Google Maps, i finally understand exactly what's occurring under the covers. So the questions are (1) how many web pages are loaded and (2) who draws the maps? Read on for the answers.

Only one web page (disregarding iframes) is loaded, or at most O(1) web pages are loaded. Proportionally it has very little HTML and a massive amount of Javascript.

Here's revelation #1. The Javascript reconnects to the web server using the XMLHTTP method (ie. not GET nor POST). This is like a GET, but it can take parameters -- grid identifier and zoom level in Google's case -- and returns XML -- or points in this case.

Exactly what data does it get? Street coordinates? From a plane's eye, yes, from a birds eye, no. Closer to the ground it gets curb coordinates. Keep i mind that this is just numerical data, X and Y coordinates.

Who does the rendering? Your web browser does. Not only can Javascript connect to a server. It can also draw lines and polygons. See DHTML: Draw Line, Ellipse, Oval, Circle, Polyline, Polygon, Triangle with JavaScript.

Two things to note. Panning is fast and smooth because new data (n cells) are requested at the same level. Zooming is not because n2 cells are requested at a new zoom level. Also n, the number of cells along one edge of the map, is related to the size of your browser window.

It's time i resurrect my (personal) map drawing project which uses Java instead of Javascript. Here all navigation is smooth and fast. Also it caches geographic information obviating the need to rerequest it.

I leave you with one question. Why doesn't Google tie zooming to the mouse wheel?