Attention: the list was moved to
https://github.com/dypsilon/frontend-dev-bookmarks
This page is not maintained anymore, please update your bookmarks.
georg fischer snorpey
dypsilon
/ frontendDevlopmentBookmarks.md
Last active
May 5, 2025 13:05
A badass list of frontend development resources I collected over time.
millermedeiros
/ gist:6595977
Last active
December 23, 2015 06:49
— forked from rmurphey/gist:5052882
rename "setLocationOnEvent" to "setLocationOnValChange"
This file contains hidden or 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
| /***************************************************************************** | |
| * __ __ _ _ ___ _ | |
| * \ \/ _\ /\/\ (_)_ __ | |_ _ _ / __\ __ ___ ___| |__ | |
| * \ \ \ / \| | '_ \| __| | | | / _\| '__/ _ \/ __| '_ \ | |
| * /\_/ /\ \ / /\/\ \ | | | | |_| |_| | / / | | | __/\__ \ | | | | |
| * \___/\__/ \/ \/_|_| |_|\__|\__, | \/ |_| \___||___/_| |_| | |
| * |___/ | |
| * | |
| * Identifying and Eliminating Code Smells | |
| * |
dr-dimitru
/ Social RESTful URLs snippet.md
Last active
January 28, 2023 03:57
Social links, +1s and shares using only HTML (no JS)
This file contains hidden or 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
| /** | |
| * IE 5.5+, Firefox, Opera, Chrome, Safari XHR object | |
| * | |
| * @param string url | |
| * @param object callback | |
| * @param mixed data | |
| * @param null x | |
| */ | |
| function ajax(url, callback, data, x) { | |
| try { |
aurri
/ getTransitionDuration.js
Created
January 11, 2014 22:24
Get transition duration in pure JavaScript, without jQuery
This file contains hidden or 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
| // Based on https://gist.github.com/snorpey/7230329 | |
| function getTransitionDuration(el){ | |
| var res = 0 | |
| prefix('transition-duration', function(v, pfx){ | |
| duration = el.style[v] | |
| if(!duration) return | |
| duration = parseTime(duration) + parseTime(el.style[pfx('transition-delay')] || 0) | |
| function parseTime(s){ return parseFloat(s) * (s.indexOf('ms') >- 1 ? 1 : 1000) } | |
| }) |
snorpey
/ load-file.js
Last active
August 29, 2015 14:00
AMD module for loading a file asynchronously. It also stores the file in the browsers local storage for quicker access. I mostly use it for loading GLSL shader files
This file contains hidden or 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
| /*global define*/ | |
| /* | |
| AMD module for loading files asynchronously. It also stores the contents of the files | |
| in the browsers local storage for quicker access. I mostly use it for loading GLSL | |
| shader files. Note: This has not been tested extensively, so use with caution. | |
| MIT License | |
| */ | |
| define( | |
| function() | |
| { |
This file contains hidden or 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
| // | |
| // GLGLitchEffect.h | |
| // Glitch | |
| // | |
| // Created by Igor on 27.08.14. | |
| // Copyright (c) 2014 Igor Muzyka. All rights reserved. | |
| // | |
| #import <Foundation/Foundation.h> |
paulirish
/ what-forces-layout.md
Last active
May 21, 2025 13:32
What forces layout/reflow. The comprehensive list.
All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.
Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.
elem.offsetLeft,elem.offsetTop,elem.offsetWidth,elem.offsetHeight,elem.offsetParent
bastianallgeier
/ when-I-was-a-beginner.md
Created
December 16, 2015 14:01
This is a little exercise to try remember the things I struggled with, when I got started with web development. It's too easy to forget about those things after years in business. I think it's super important to keep the ability to put yourself back into the position of a beginner from time to time in order to not overcomplicate your own work and to not throw the typical "just" and "simply" sentences at other people, who get started.
The following list is not complete or very detailed. It's really all about writing down some memories quickly. Feel free to follow this experiment for yourself if you think it's useful.
- Breaks. Why the hell doesn't text wrap in the browser when I add a line break to the source code?
- Paths: I absolutely struggled with the basic concept of absolute and relative paths and why stuff doesn't get loaded correctly when I messed paths up in URLs.
bastianallgeier
/ kirby-patterns.md
Last active
March 19, 2019 23:06
When I heard about Brad Frost's Patternlab for the first time at beyond tellerrand I was intrigued. The idea of splitting your design work for a website into simple modules or patterns isn't new and starts to become more and more of a standard. But organizing this into a very visual styleguide/patternlab seemed to make so much sense. Brad also introduced a very interesting approach with his separation of modules into categories, such as atoms, molecules and organisms.
I started porting Brad's patternlab app to Kirby, but it never really made it to something polished and it turned out for me after using it for Kirby's panel UI, that it's actually a pain in the ass to maintain such a pattern collection.
The problem with such a styleguide or patternlab is that it exists next to the real thing. When you change something in your code base you also have to update the particular code for the pattern in patternlab. To be honest I went very quickly from being