Web-front-end Report
April 17th, 2015
Lu Yuan
Some Tricks
Detect if a GIF is Animated
animated-gif-detector
For those of you that prefer JavaScript (...my people...), I found a really simple animated GIF detection library on NPM: animated-gif-detector. Its API couldn't be shorter:
var fs = require('fs');
var animated = require('animated-gif-detector');
> animated(fs.readFileSync('wtf.gif'));
// true
> animated(fs.readFileSync('blank.gif'));
// false
Detect if a GIF is Animated
Determine If A Number Is Prime Using JavaScript
About JSON
anyToJSON
var anyToJSON = require("anyToJSON");
anyToJSON.csv({path: "100.csv"}, function(){
console.log(anyToJSON.data )
})jsop
var jsop = require('jsop')
var config = jsop('config.json')
config.foo = 'bar'μson
endpoint:id:wikipedia pages:[Malta Prague "New York"]
--->
[
{
"endpoint": {
"id": "wikipedia"
}
},
{
"pages": [
"Malta",
"Prague",
"New York"
]
}
]- endpoint:
id: wikipedia
- pages:
- Malta
- Prague
- New York
--->
{
"endpoint": {
"id": "wikipedia"
},
"pages": [
"Malta",
"Prague",
"New York"
]
}New APIs
fetch API
// url (required), options (optional)
fetch('/some/url', {
method: 'get'
}).then(function(response) {
}).catch(function(err) {
// Error :(
});
File API
MutationObserver API
var observer = new MutationObserver(function(mutations) {
// For the sake of...observation...let's output the mutation to console to see how this all works
mutations.forEach(function(mutation) {
console.log(mutation.type);
});
});
// Notify me of everything!
var observerConfig = {
attributes: true,
childList: true,
characterData: true
};
// Node, config
// In this case we'll listen to all changes to body and child nodes
var targetNode = document.body;
observer.observe(targetNode, observerConfig);The original jQuery source code
