- CSSDig Analyze your CSS in a new way. Consolidate, refactor, and gawk at the 37 shades of blue your site somehow ended up with.
- CSS Stress It indexes all the elements and their classes, and then--class by class--it removes one, and times how long it takes to scroll the page.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta name="description" content="Menu Selector Animation -- trying not to break..." /> | |
<link href='http://fonts.googleapis.com/css?family=Raleway:400,500,800' rel='stylesheet' type='text/css'> | |
<meta charset="utf-8"> | |
<title>JS Bin</title> | |
<style id="jsbin-css"> | |
* { | |
-webkit-box-sizing: border-box; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
(function(window){ | |
var EVENT_EXISTS = 'GlobalEvents: Event already exists.'; | |
var eventIsRunning, | |
_eventStack, | |
_findByName, | |
stackEvent, | |
removeEvent, | |
eventListener, |
- Designing in the Browser - https://medium.com/philosophie-is-thinking/designing-in-browser-a-real-workflow-5320e31fa7ca (Feb 23 2015)
- Let's Stop Breaking the Affordance of Scrolling - https://medium.com/user-experience-design-1/dear-web-designer-let-s-stop-breaking-the-affordance-of-scrolling-fe8bf258df7b (Mar 24 2015)
- How Users Perceive Interfaces - https://medium.com/@kresokraljevic/how-users-really-perceive-interfaces-psychological-and-biological-approach-to-user-interfaces-c1271e0225c7
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
#!/bin/bash | |
# This script intends to remove all unused images from the project. | |
# Use with caution and don't forget to back-up before using. | |
SRC=./source/images | |
# Create a `.tmp` folder | |
mkdir -p .tmp |
The basic structure of a React+Flux application (see other examples)
- /src/actions/AppActions.js - Action creators (Flux)
- /src/components/Application.js - The top-level React component
- /src/constants/ActionTypes.js - Action types (Flux)
- /src/core/Dispatcher.js - Dispatcher (Flux)
- /src/stores/AppStore.js - The main store (Flux)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="logo"> | |
<svg width="81px" height="81px" viewBox="0 0 81 81" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns"> | |
<defs></defs> | |
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"> | |
<g id="logo" sketch:type="MSLayerGroup" fill="#0AB3C4"> | |
<path d="M62.4,7.4 C66,7.4 68.9,10.3 68.9,13.9 C68.9,16 68.6,49.7 71.9,71.7 C53,69.1 21.5,68.9 14.4,68.9 L13.9,68.9 C10.3,68.9 7.4,66 7.4,62.4 L7.4,13.9 C7.4,10.3 10.3,7.4 13.9,7.4 L62.4,7.4 L62.4,7.4 Z M62.4,0 L13.9,0 C6.2,0 0,6.2 0,13.9 L0,62.4 C0,70.1 6.2,76.3 13.9,76.3 L14.4,76.3 C19.7,76.3 63.8,76.4 78.7,80.5 C78.8,80.5 79,80.6 79.1,80.6 C80.1,80.6 80.9,79.6 80.6,78.6 C75.8,58.8 76.2,13.9 76.2,13.9 C76.3,6.2 70.1,0 62.4,0 L62.4,0 Z" id="Shape" sketch:type="MSShapeGroup"></path> | |
</g> | |
</g> | |
</svg> | |
<div class="logo-bars"> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
javascript:(function()%7B(function(doc)%20%7Bvar%20css%20%3D%20document.createElement('style')%3Bcss.appendChild(doc.createTextNode(''))%3Bdoc.head.appendChild(css)%3Bvar%20styles%20%3D%20%22body%3Abefore%20%7Bcontent%3A%20''%3B%20z-index%3A%20999%3B%20background%3A%20%23C1AE34%3B%20left%3A%200%3B%20right%3A%200%3B%20pointer-events%3A%20none%3B%20top%3A%200%3B%20bottom%3A%200%3B%20position%3A%20fixed%3B%20opacity%3A%20.4%3B%20width%3A%20100%25%3B%7D%22%3Bcss.sheet.insertRule(styles%2C%200)%3B%7D(document))%7D)() |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* From Google Developers; Collect all third party requests using the Performance API. | |
* Source: https://developers.google.com/web/updates/2015/07/measuring-performance-in-a-service-worker | |
* | |
*/ | |
var getThirdPartyRequests = function() { | |
var thirdPartyRequests = []; | |
var requests = window.performance.getEntriesByType("resource"); | |
var currentHost = window.location.host |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Kinda pseudo code | |
// This script will download and resize each image to half | |
// Because the images can be RRREAAALLY big | |
// the download and resize is done sequentially (in my case, inside a child_process) | |
// to ensure that memory is released after each image. | |
// We dont know how many images there are | |
let images = [ | |
'https://flickr.com/photo/1', | |
'https://flickr.com/photo/2' |