All Posts
-
TIL what is npm Script javascript node
Despite their high usage they are not particularly well optimized and add about 400ms of overhead. In this article we were able to bring that down to ~22ms.
-
TIL Netflix's System Design systemdesign netflix aws database image
Netflix operates in two clouds: Everything that happens after you hit play is handled by Open Connect. Open Connect stores Netflix video in different locations throughout the world. Anything that doesn’t involve serving video is handled in AWS.
-
TIL the Waluigi Effect in LLMs chatgpt ai
The Waluigi Effect: After you train an LLM to satisfy a desirable property 'P', then it's easier to elicit the chatbot into satisfying the exact opposite of property 'P'.
-
TIL defining your video game in hooks videogame postmordem
I like to think of a game’s potential in terms of 'hooks.' By this, I’m referring to the inherent momentum within a title to hook a buyer. I was just looking at the data on Steam, and there were 10,963 new game titles released in 2022. My strong suspicion is that most of them never generated a dime in revenue. Without some hook for your game, no one will ever play it, much less buy it.
-
TIL fancy methods to transform Javascript Objects objects javascript mdn
You can use Object.entries(), Object.keys(), Object.fromEntries()...
-
TIL how to hide your JS code obscurity javascript encryption
ONE THING TO NOTE: Encrypting a script is stronger than obfuscation, both methods are still not adequate to protect secret content. Honestly, I don't think it's worth it on a production site, and instead just go with pure server-side if you want security. But it's fascinating.
-
TIL how build tools work webpack ast buildtools minifying compiling bundling
There's 4 steps. Compiling -> Minifying -> Bundling -> Code-splitting
-
TIL how to build a chrome extension that steals everything security extension pii keystroke
There's 3 components that will be used - background Service worker, Content script, and popup.
-
TIL minimal responsive image component component image browser
So when I saw that JS frameworks made image wrapper components (like Nuxt was with nuxt-img), I was blown away and wanted this power at work.
-
TIL executing a xss using a SVG image image svg security xss
This user was able to upload a '.svg', that then executed a xss attack to steal local storage data.
-
TIL How to steal localData using an XSS attack security xss mdn
But that's just a red flag that opens the door to bigger issues.
-
TIL Dwarf Fortress Game Design gamedev gamedesign
'Do not design for your experienced players' and some more tips from one of the most complicated games ever
-
TIL the alternate keyword stylesheet css darkmode image
If 'alternate' appears along with the stylesheet keyword, the linked file is an alternative stylesheet. It won’t be applied to the document, but it will be ready for when we need it.
-
TIL Clear-Site-Data mdn cache
The Clear-Site-Data header clears browsing data (cookies, storage, cache) associated with the requesting website. It allows web developers to have more control over the data stored by a client browser for their origins.
-
TIL not obsessively trying to be DRY cleancode dry
Quite often, DRY is applied to any duplication, rather than specifically to the duplication of business rules and knowledge. This is often made worse by automated code analysis tools, which will often highlight any duplication as a code smell.
-
TIL the cost of spaces on TypeScript compile prematureoptimization typescript
One nice surprise we found from using esbuild was that on-disk size was reduced by more than we expected. It turns out that a big reason for this is that esbuild uses 2 spaces for indentation in output instead of the 4 spaces that TypeScript uses. When gzipping, the difference is very small; but on disk, we saved a considerable amount.
-
TIL a bunch of new functional programming words patterns functionalprogramming image
It's so funny seeing developers re-invent functional programming paradigms. We really need to teach this stuff better.
-
TIL Indirection and Swallowing the error programming utilities
Op shared a tryCatch util that is problematic.
-
TIL Why is TextEncoder a class oop javascript
My assumed answer - it was for extension. What does reddit commenters have to say about it?
-
TIL Logical Properties css Internationalization
For that sweet sweet Internationalization you want to avoid directional words like 'left', 'right', 'top', and 'bottom'.
-
TIL Evil code bash malicious
These examples are unethical, and can even be criminal. You can get jailtime. You have been warned and I cannot be held liable for your dumb-assery.
-
TIL Static Blocks vs Dynamic Blocks blocks wordpress
A static block is a piece of content whose markup is known when the page is saved. The block saves its content and markup directly in the post content. A dynamic block is a piece of content whose markup and exact content are not known when the page is saved.
-
TIL how to convert a shortcode to a WP block block wordpress
Traditionally, shortcodes were a way that plugin developers could provide users the ability to add specific plugin functionality anwhere on their site. But shortcodes are not very user friendly, nor was hunting down the relevant data you needed to render the correct data for the shortcode. Converting existing shortcodes to blocks provides a much greater user experience in all aspects.
-
TIL Play music in a bash script music bash fun
On Macs, you have the afplay command. to play some sweet tunes.
-
TIL Google Sheets has named functions function spreadsheet
It's a way for you to make functions using built-in formulas.
-
TIL how to JUICE up your UI videogame image
The delightful chimes sound that plays when Mario collects a mushroom. The 1UP text that appears is essential. Communicating the player gained an extra life. The sound is the Juice.
-
TIL why google recommends you avoid document.write() performance javascript browser corewebvital
By injecting it with code, it bypasses the preload scanner. This means that the browser can’t request this file until it’s actually run the '<script>' block that inserts it, which is very much just-in-time (and too late).
-
TIL Using pseudo-classes in your querySelector! css javascript
let notTuna = document.querySelectorAll('.sandwich:not(.tuna)')
-
TIL using abortController to removing events mdn javascript
Trying to unhook a eventListener? Don't use `removeEventListener`, instead use AbortController.
-
TIL detecting if a user is online with JS fingerprint javascript mdn
You can use the navigator.onLine api.
-
TIL prioritizing Javascript performance javascript corewebvitals
... async and defer attributes should be used where possible to avoid render blocking of the DOM. Render blocking is when the browser must halt all rendering of the page in order to process a resource that the page depends on.
-
TIL problem with AJAX fetch javascript performance
Synchronous XHR is harmful for performance because the event loop and main thread is blocked until the request is finished, resulting in the page hanging until the data becomes available. fetch is a much more effective and efficient alternative with a simpler API, and has no support for synchronous fetching of data.
-
TIL why jpeg vs jpg image extension history
In DOS systems, a filename extension was a different part of the name stored in a different field that can only be 3 characters. You still see this legacy today in Microsoft's .NET software, where most system calls that use the word 'filename' in their name don't really mean the whole filename. They mean just the part without the extension.
-
TIL Container Queries are live! container css
After @container, elements can respond to a parent container size or style! The only caveat is the containers must declare themselves as possible query targets, which is a small requirement for a large benefit.
-
TIL the history of fonts and COLRv1 image browser font
COLRv1 fonts, have a smaller footprint, vector-scalable, reposition-able, gradient-featuring, and blend-mode powered fonts that accept parameters to customize the font per use case or to match a brand.
-
TIL ":has" selector css organization
Before :has(), the subject of a selector was always at the end. Like 'ul > li:hover' or 'ul > li:not(.selected)'. Now we can do ul:has(> li)
-
TIL Harmful language words speaking
We’ve talked before, we’ve used that phrase “words matter” because words matter, words are the way we communicate with one another, it is how we perceive our self value in our own head.
-
TIL ways to organize eventListeners cleancode naming
Some code spaghetti I made recently was creating a lot of eventListeners for multiple buttons, and then forgot what they all connected to.
-
TIL a helper to make things uppercase javascript helper string
ucWords function converts the first character of each word in a string to uppercase. This function is the same as PHP’s ucWords function.
-
TIL the core-js spam trolling image javascript git
This entire repo is a hilarious rabbit-hole when you combine this with everyone complaining about the console spam that the dev added to it asking if anyone can find him a job. One of my favorite PRs
-
TIL how Error correction works in HTML error html table browser
You never get an 'Invalid Syntax' error on an HTML page. Browsers fix any invalid content and go on.
-
TIL Legend of Zelda course corrects movement movement videogames pixel
If you play The Legend of Zelda for a while, you’ll notice that Link doesn’t ever get hung up on obstacles due to unexpected collisions, nor do you ever just miss a bad guy by a pixel or two when attacking him.
-
TIL what DOCTYPE means moderndevelopment html
tl;dr: DOCTYPE declaration in the first line of the HTML file, to instruct the browser to run the code in Standard mode.
-
TIL how Levels.fyi used Google Sheets database google quickanddirty image
Our philosophy to scaling is simple, avoid premature optimization.
-
TIL How many Fucks there are in Linux comments git image
As of today, in the Linux Repo, there are comments that contains the following mentions: 1,651 for hacks, 2,863 for workarounds, and 4,102 for fixme
-
TIL Dirty bit systems in browsers browser dom webpage
In order not to do a full layout for every small change, browsers use a 'dirty bit' system. A renderer that is changed or added marks itself and its children as 'dirty': needing layout. There are two flags: 'dirty', and 'children are dirty' which means that although the renderer itself may be OK, it has at least one child that needs a layout.
-
TIL Web Performance with Javascript javascript webworker performance criticaljs image
Overall, we should be loading the most important JS first to get the website working. Then load all your third-party scripts onto your web worker, which then responds with 'Success' once it loads, so you can then interact with it.
-
TIL how QR codes work barcode qr image
The Quick Response code was invented by a subsidiary of Toyota to track parts across the manufacturing process.
-
TIL Shape-Outside to wrap text css shapes codepen
Shape-outside provides a way to customize this wrapping, making it possible to wrap text around complex objects rather than simple boxes.
-
TIL keywords in package.json node keywords
Today I learned what keywords are in a package.json file! It's a collection of keywords about a module. Keywords can help identify a package, related modules and software, and concepts.
-
TIL Tagged Templates mdn javascript image
Tags allow you to parse template literals with a function. The first argument of a tag function contains an array of string values. The remaining arguments are related to the expressions.
-
TIL Find Command search terminal commands
I wanted to look for files with a specific extension. You can do that with ls *.(mp3|exe|mp4)
-
TIL Multiple Fetch Requests javascript api
I've been frequently dealing with this scenario in the past few weeks. I wanted to make multiple fetch requests, and then merge everything together when it's all done. To make multiple/parallel fetch requests:
-
TIL Forever Seinfeld fun ai
Nothing, Forever is a parody of '90s sitcoms, done in the style of '90s point-and-click PC games (but, you know, in 3D). We set out to build something weird, new, and novel, and this is what we ended up with.
-
TIL wanting to use the latest thing mdn latest jquery github
In evaluating a solution, be sure to consider the library dying out or becoming a maintenance burden after 5 years (e.g., everyone trying to get off jQuery onto Web Components).
-
TIL why you should always use textContent js text
Today I learned the difference between 'Node.textContent'. It handles all elements, even hidden ones. It also prevents XSS attacks since it strips tags.
-
TIL critical 14kb critical osimodel webpage
On the OSI Model -- the physical layer, we send data in 14kb packets. And servers respond to HTTP requests in 14kb chunks. (Note: It can be set to different sizes, but by default... 14kb is the standard/magic number)
-
TIL no global styles opinion css
Global styles is the largest **anti-pattern** in CSS --- strong DISAGREE.
-
TIL types of malicious npm attacks security npm malware
In the case of ionicons, the miscreants published 18 versions containing malicious form-stealing code; for example, icon-package (according to NPM download stats) has over 17,000 downloads. Other typo-squatting examples include umbrellaks instead of umbrellajs and so on.
-
TIL malware in node_modules malware npm security hacking
The very first line fetches the victim's country code using their IP address. If the victim is from Russia, Ukraine, Belarus, or Kazakhstan, then the malware exits early.
-
TIL Infinite State Machines in Doom fsm videogames ai doom
The actual core logic of the enemies is a Finite State Machines: a simple but effective mechanism to state that a character executes a specific behaviour when in a given state, and what the conditions are that will force it to change.
-
TIL Land in Virtual Games mmo videogames economy
in [Star Wars] Galaxies … there was ample room for everyone to own a house if they chose – but people did things like build player cities atop the entrances to dungeons to monopolize access to resources.
-
TIL Scoping with Cypress javascript testing cypress
So you wanted to find a specific element called `heading`. But you have a BUNCH of elements called `heading`. By using `within()` helper, you can force it to only look inside `main` elements.
-
TIL the first webcam history webcam coffee
The Trojan Room coffee pot was a coffee machine located in the Computer Laboratory of the University of Cambridge, England. Created in 1991 by Quentin Stafford-Fraser and Paul Jardetzky, it was migrated from their laboratory network to the web in 1993 becoming the world's first webcam.
-
TIL SolidJS reactivity javascript reactivity
SolidJS is a JavaScript framework that supports binding data to elements that it then syncs and displays on web pages.
-
TIL a mod dedicated to his fiance readme sad
The best way to avoid DVT is simple: Save your game, stand up, and walk around for 2-3 minutes every 3 or 4 hours. Go to the fridge, pee, look out the window, play with your pet...anything, just MOVE. That simple action would have saved her life: it could save yours.
-
TIL porting Zelda Classic from a Windows App to the browser videogames assembly compiling
He learned about each layer of the codebase, and how to transpile it down to the next layer until finally hitting Web APIs.
-
TIL Computed Properties in Javascript naming javascript mdn
Today I learned about Computed Property names.
-
TIL outputting objects in Node logging node
In your Node projects -- sometimes you just need to output the object. Stringify it.
-
TIL if TypeScript is worth it typescript javascript
The answer: No, according to HackerNews. But HackerNews audience aren't exactly representative of average developers? From my perspective, they're the 'startup' and 'ship fast and break things' folks. (I mean, I am too!)
-
TIL Very Efficient Code cleancode bigo
This is a great solution. Easy to understand. Executes really fast. No real-time string concatenation. No over-engineering. String appearance is easily customized.
-
TIL delta time time javascript
Delta time, also known as 'time delta,' refers to the difference between the 'current time' and the 'last time' a piece of code was executed. In JavaScript, delta time can be calculated using the Date object or by using the performance.now() method.
-
TIL finding the browser being used javascript browser
How to detect the browser you're using, with javascript.
-
TIL ChatGPT prompts ai chatgpt machinelearning
Don’t ask it to write an essay about how human error causes catastrophes. The AI will come up with a boring and straightforward piece that does the minimum possible to satisfy your simple demand.
-
TIL Libuv javascript node
Libuv also implements two extremely important features of Nodejs which are the event loop and the thread pool and in simple terms, the event loop is responsible for handling easy tasks like executing callbacks and network I/O while the thread pool deals with heavy work like file access or compression.
-
TIL brackets breaking elements in JavaScript javascript linter
The 'automatic semicolon insertion' it does is an error correction process
-
TIL obscure search engines search index
We all know the big ones like Google and Bing that have massive Indexes. THen we know about Wolfram Alpha and DuckDuckGo. But have you heard of Thunderstone?
-
TIL IndexNow seo search
IndexNow is an open-source protocol that allows website publishers to instantly index across participating search engines, updating results based upon the latest content changes.
-
TIL all the different security roles roles security certifications
In appsec most notably offense vs defense. They are complimentary of course but the skills differ. For offense you need specific tools, need to get used to testing applications sometimes without source code access.
-
TIL Trovald's Magic Numbers magic linux
These magic numbers are intended to safeguard against a typo or potential bit flips in the syscall number. Since reboot is a destructive and non-syncing operation, it's important to make absolutely sure that it isn't called accidentally due to a typo, a misbehaving program, or memory error
-
TIL node modules fs and os node streams os
with fs - you can access files, read files, make directories, chmod. With os - get stats, machine, version, hosts.
-
TIL Node Streams node streams promise
Imagine if you did some data-extensive fetch request getting a 1 gig file. 1 gig can take a while, and it's fetching it in memory.
-
TIL Websockets node communication
They offer a long lived, bidirectional communication channel between client and server. Once established, the channel is kept open, offering a very fast connection with low latency and overhead.
-
TIL Node.js Event Emitter node javascript
This is kinda like the addEventListener() for browser javascript.
-
TIL Double Exclamation shorthand for booleans javascript booleans
JavaScript (and TypeScript) lets you convert a non-Boolean value to Boolean using the double exclamation shorthand. '!!'
-
TIL how to delete all cookies with Javascript javascript cookies
If someone selects 'Reject', you want to remove all the tracking cookies. You can easily clear all cookies stored in a web page by accessing the cookie using document.cookie and clearing it.
-
TIL Content sectioning html webdev browser
Content sectioning or landmarks, like sidebar, content, footer. You know, like better names.
-
TIL the Description List element html semantic tables
Lists of name–value pairs (or, in some cases, name–value groups) are a common pattern across the web, in part due to their versatility. HTML lets us mark up these lists with a combination of three elements
-
TIL MSW for mocking testing website
MSW is a API mocking tool. Mock by intercepting requests on the network level. Seamlessly reuse the same mock definition for testing, development, and debugging.
-
TIL Sparse Arrays array javascript
The ['Batman', , 'Bane'] array is a sparse array. See how it there is a blank?
-
TIL accessing different data attributes javascript data html
You can access it in javascript using element.getAttribute('data-sandwich'). A better way is to go with the Element.dataset property.
-
TIL aspect ratios css iframe
We can target iframe elements directly with a few lines of CSS to preserve their dimensions in responsive layouts, without the need for a wrapper element.
-
TIL Performance tests performance javascript optimization
While doing performance tests, I was curious how long a loop was running. I used the performance.now() trick.
-
TIL playing Tetris inside Zsh terminal easteregg
If you're using a Mac, you're probably using iTerm. 1. Load iTerm 2. launch emacs. 3. Launch Tetris.
-
TIL about Ian Brown twitter workplace
During the call, Musk said that Twitter would need to do a 'total rewrite of the whole thing' if it wanted to have a 'really high velocity.'
-
TIL the history of fonts fonts history browser
We came up with all sorts of clever techniques to do what was called 'image replacement' for text. Some of the techniques involved CSS and background images. One of the techniques involved Flash
-
TIL getting the height with Javascript javascript size css
Say you wanted the height of a element. getComputedStyle gets you that. BUT -- it may lie about it to avoid css history leak. Instead use computedStyleMap.
-
TIL not using try/catch block with promises for error catching promises javascript advanced errorcatching
You shouldn't use a try/catch block inside the Promise Definition. Your promise is already doing that.
-
TIL Rainbow Books for CD formats history cd data videogames
Several volumes of specifications covering the topic, together called the 'Rainbow Books', were released over a period of 20 years from 1980 to 2000.
-
TIL using proxies for reactivity proxy advanced javascript
A Proxy let you detect when someone gets, sets, or updates a property on an object, and run code when they do. But why? This usecase -- when you add/update the object, it also updates localStorage!
-
TIL AggregateError promises javascript mdn
I heard the term AggregateError in relations to 'Promise.Any', So it's several errors wrapped in a array. That's all.
-
TIL newbie-friendly code code organization writingcode readability newbie
Adding clear conventions. One-way street data flow. Data structures. Stop it with Acronyms.
-
TIL adding a helper function for CSS classes css javascript utility
I like this helper. This lets you quickly add/remove CSS classes to your elements in a easy-to-read way.
-
TIL how JSON bet on simplicity json api history
I had a goal of being able to put JSON standard on the back of a business card
-
TIL JS Cron and process.platform node javascript cron
Cron is a tool that allows you to execute something on a schedule. This is typically done using the cron syntax. process.platform tells you what platform the user is running. For this usecase, if it's win32, use robocopy. Else use rsync.
-
TIL that Japanese sites are dark and dense webdesign development asia
In Japan, websites are often look incredibly outdated.
-
TIL how Street Fighter 2's Title animation worked videogames sprites
Looking at the spritesheet, how the heck does the small logo become the big logo?
-
TIL fingerprinting with CSS security css
Fingerprinting refers to building up enough metadata about a user that you can essentially figure out who they are. JavaScript has access to all sorts of fingerprinting possibilities, which then combined with the IP address that the server has access to, means fingerprinting is all too common.
-
TIL functions in sass css sass function
You can declare functions in sass using @function. You can even write for loops, return values, and even create @warn and @error.
-
TIL CSRF Attacks security hack forms
Cross-site Request Forgery (CSRF) is submitting post data from a fake site. To prevent CSRF attacks, web applications should implement measures such as requiring a valid CSRF token to be included with each request, checking the referer header, and using secure cookies.
-
TIL Little Big Details Easter eggs easteregg css
I was in search of Easter Eggs and found this Tumblr littlebigdetails.com. I was trying to find the easter egg in real life,,,. But it looks like the site switched to a JS framework. It looks very svelte, as it uses a lot of shadow dom elements!
-
TIL the difference between a VPN and a reverse proxy networking homenetwork
A reverse proxy makes a private resource publicly available. A VPN lets you connect to a private network and access the resources on it securely when away from it.
-
TIL passive aggressive easter egg easteregg search css
Go to this corporate website and open the search (top right) and then submit with an empty search 7-8 times for a passive aggressive response.
-
TIL Proving people wrong inspiration seals
In chapter 3 where during training, a instructor said to another student, 'You're a tiny little man. Those waves will break you in half.' The student said, 'I won't quit.'
-
TIL how to get what browser with just css browsers safari css
Today I learned about how to tell what browser you are using with just CSS.
-
TIL prepend html js dom
When you're creating new elements in Javascript, you want to attach the new element to something that exists in the DOM already. You do that with append, and prepend.
-
TIL the simulating a Pipe function js functionalprogramming
It’s a pipe function that allows you to chain multiple operations together by taking a series of functions as arguments and applying them in a specific order to the input.
-
TIL reverting git git undo
Two solutions. One is re-write history and hide your mistakes. The other is showing the history, to remind you of your mistakes.
-
TIL the Quake 3 Fast Inverse Square Root hack math videogames magicnumber
Quake III Arena, a first-person shooter video game, was released in 1999 by id Software and used the algorithm.
-
TIL copy without overriding in command-line terminal files
The cp command has a -n flag that you can use to prevent the copied file from overriding another file if one with the same name exists
-
TIL how a game developer's obsession with karaoke paid off gamedesign devstory
Initially, he says coworkers criticized him for going too far with the minigame – at the time, it was uncharacteristic to have the generally-stoic protagonist, Kiryu, doing something so goofy. But his instincts proved correct; it became one of the most popular features in the Yakuza series and went a long way in humanizing Kiryu.
-
TIL using jq to turn JSON into CSV terminal csv json
jq is like sed for JSON data - you can use it to slice and filter and map and transform structured data all within the command line.
-
TIL the new Temporal API datetime javascript proposal
Temporal is a TC39 proposal for a non-sucky date time API
-
TIL safe areas for mobile browsers css mobile mdn
The problem you quickly encounter is that the visible viewport is not per se the same as the interactive viewport. Mobile browsers tend to prioritize essential UI elements (like the home-bar on IOS) for interactivity at all times.
-
TIL the difference between partial application and currying advanced javascript closure
Partial application transforms a function into another function with smaller set of arguments. Currying creates nesting functions according to the number of the arguments of the function. Each function receives an argument.
-
TIL the stack and heap javascript memory global
The stack is a data structure that JavaScript uses to store static data. The Heap is Dynamic memory allocation, storing objects and functions. Garbage Collection.
-
TIL more clean code principles cleancode principles
Functions should either answer something or do something, but not both. If you use third-party libraries, wrap them. Throw errors.
-
TIL Math.random() for design tricks codepen art random
Math.random() is awesome! However, if you dealing with sensitive applications and need a more secure method of randomization, I’d recommend WebCrypto.
-
TIL self-hosting your own Google Fonts fonts optimization cdn selfhost
I'm all for self-hosting. So seeing this question asked 'Should you self-host Google Fonts?', my immediate answer is ABSOLUTELY. But here's the edge-cases.
-
TIL how to convert a Callback to a Promise callback promises advanced
Callback functions work well for simple asynchronous operations, but can become difficult to manage and lead to 'callback hell' when dealing with more complex operations. Promises follow a specific pattern.
-
TIL loading third-party scripts onto service workers serviceworker javascript cache optimization
An alternative to self-hosting scripts would be using Service Workers to cache them. This can give you greater control over how often they are re-fetched from the network. This could also be used to create a loading strategy where requests for non-essential third parties are throttled until the page reaches a key user moment.
-
TIL IBM had corporate songs history
In 1927, Watson ordered the company to publish a songbook titled 'Songs of the IBM,' to be distributed to employees
-
TIL about why Node was invented node history javascript
Node.js applications never buffer data, which dramatically reduces the processing time of uploading files, such as videos or audios. In other words, it simply outputs data in chunks, meaning that, for example, a user can watch videos without any interruption.
-
TIL How to implement two-way binding without a framework javascript vue codepen react data
One of the reasons we use React or Vue is because of that sweet sweet two-way binding. It's the automatic syncing of data between the model (data) and the view (UI) in both directions. Any changes made to the data will automatically update the view, and any changes made to the view will automatically update the data.
-
TIL Event Delegation javascript optimization events
Event delegation is one of the most helpful patterns for DOM events! Adding too many event listeners means JavaScript is storing it all in memory. Event Delegation lets you store one listener, that then looks for the target.
-
TIL what matters for JS optimization javascript loops memory
Optimizing your Javascript - Using getElementById() vs querySelector()? Doesn't matter. Loops? Doesn't matter. What matters: Render Blocking code, Repaints and Reflows, Memory allocation
-
TIL that the max size of a Map/Set is 26843544 javascript mdn v8 math
JS Maps and Sets are implemented by OrderedHashTable. OrderedHashTables double in size when they need to grow, and their max size is 26843544. After 16777216 elements, doubling that exceeds the max, so the allocation fails.Currently these data structures are not implemented to be usable for large in-memory datasets. Also note that the JS specification itself doesn't require that Maps and Sets must scale with available memory.
-
TIL ELI5 What an Operating system is os eli5
If you traveled and wasn't able to speak the language, how would you get by? You would use a translator, who would help you around. But if everyone used a translator, tourists parties would quickly double in size.
-
TIL Cleaner data structures cleancode data patterns
Avoid unnecessary contexts, optional chaining, better error handling, avoid using flags
-
TIL Cleaner Functions cleancode functions patterns
tl;dr - Limit the number of arguments, Avoid executing multiple actions in a function, Avoid mutation, Avoiding non-negatives, Return Early
-
TIL jq and htmlq commandline curl
jq and htmlq, which are two command line libraries that make curl requests then return filtered data. jq is for json, and htmlq is for html!
-
TIL A practical Curry Example curry advanced javascript
Currying is a programming technique where you take a function with multiple arguments, and you turn it into smaller sequential functions where you pass one argument at a time. But many use-cases kinda suck
-
TIL how NGINX knows to look for index.html vs index.php servers nginx php
What happens when visitor hits /foo/bar URL?
-
TIL php-fpm php webdev servers
PHP runs as a separated service when using PHP-FPM. By using this PHP version as language interpreter, requests are processed through a TCP/IP socket; so that the Nginx web server only handles the HTTP requests and PHP-FPM interprets the PHP code. The fact of having two separate services is key for increasing efficiency.
-
TIL the difference between single-threaded & multi-threaded architecture php javascript performance
For web dev, we don't need it. We're not bottle-necked by the processing power. We're instead bottlenecked by the ability to read files/databases. We can simulate multi-threading (and improve our app's performance) using async/await.
-
TIL HTTP "No-cache" headers cache server php apache
Using PHP and apache .htaccess file to force reload
-
TIL Windowing in Browsers js performance
Windowing only allow you to render what's available. Using twitter as a example, with tweets, when you scroll through hundreds of tweets and inspect the DOM, they just put a bunch of blank space above so there's not like 400 tweets above you.
-
TIL aria-expanded for showing when things are hidden/shown accessibility html accordion
The aria-expanded attribute is set on an element to indicate if a control is expanded or collapsed, and whether or not its child elements are displayed or hidden.
-
TIL ARIA role presentation accessibility semantic html
Think of this as a reset. You use role=presentation to remove semantic meaning from an element.
-
TIL reduce-motion-blur accessibility css
Dizziness and vertigo are symptoms of a vestibular balance disorder. If the user has set up a user preference that they prefer motion-based animation be disabled/reduced, we can tap into that. As web developers, we can also support them.
-
TIL Icon Fonts being the suckfest that they are accessibility fonts svg
In 99% of all use-cases, SVGs are better.
-
TIL Decorative Images accessibility html images
make a blank alt='' for presentation images - aka image might already be given using adjacent text, or the image might be included to make the website more visually attractive.
-
TIL that adding a psuedo-h7 accessibiilty html mdn
Natively, there are 6 heading levels. What if accessibility-wise, you wanted a new heading level?
-
TIL how outsiders see Javascript typescript javascript horror
The bane of my existence - 'SyntaxError: Cannot use import statement outside a module'
-
TIL a tool to generate contributors to a open-source github project git generator
I found this sweet tool that helps identify who are all the contributors to a project at contrib.rocks
-
TIL Adapters, proxies, and decorators oop
An adapter provides a different interface to the object it adapts. A Proxy provides the same interface as its subject. A Decorator adds one or more responsibilities to an object.
-
TIL Prototypical Inheritance vs return functions javascript proto functions
When to use proto versus return functions?
-
TIL super() mdn oop js
When you use super(), it's like you're telling the new object to copy everything from the old object first, and then add or change anything else that's different.
-
TIL the difference between Factory Pattern and Builder Pattern oop pattern
The factory method pattern requires the entire object to be built in a single method call, with all the parameters passed in on a single line. It may evolve into a builder pattern. A builder pattern is a wrapper object around all the possible parameters you might want to pass.
-
TIL Open-Closed Principle in OOP oop example
In object-oriented programming, the open–closed principle (OCP) states 'software entities (classes, modules, functions, etc.) should be open for extension, but closed for modification.'
-
TIL a code snippet to check if the value is of type javascript gist
This short snippet helps us check!"
-
TIL the difference between Web workers, Service workers, Worklets, Websockets webworkers browser chromeextension
Web Workers are scripts that offload work from the main thread. Worklets connect to the rendering pipeline. Websockets opens up a 2-way connection.
-
TIL good numbers for Web Metrics lighthouse metrics
Given that the 'good' FID threshold is 100 ms, we can say that at least 90% of websites meet this bar. In fact, we know from the analysis done in the Performance chapter that 100% of websites actually have good FID experiences on desktop devices, and 92% on mobile devices. FID is an unusually permissive metric.
-
TIL avoiding including Sourcemaps compression performance buildtools
Sourcemaps are a base64 representation of the original source into a production-ready JavaScript asset.
-
TIL switching over to Service Workers with Chrome extensions chrome extensions mdn
Background Pages are like 'hidden pages' that a developer would create behind the scenes. That hidden page would do various JS needs to simulate functionality. Vs a service worker is a script that your browser runs in the background, separate from a web page, opening the door to features that don't need a web page or user interaction
-
TIL using defer/async optimization javascript mdn
So an old and often-touted best practice for performance has been to load your JavaScript in the footer of the document to avoid render blocking of scripts. By putting it in the footer, the DOM is constructed before your scripts have a chance to run. That's dumb.
-
TIL about console.dir debug mdn javascript
If you console.log a element, you will get it's HTML markup. If you want it as a JS object, use console.dir instead
-
TIL about youtube-dl video terminal
youtube-dl is a command-line program to download videos from YouTube.com and a few more sites.
-
TIL Breath of the Wild's many parameters gamedev zelda
One of my favorite things to do is dig into how games are made on the data side.
-
TIL Npx npm-check-updates node npm
Updating packages is frequent chore to do so you are always running the latest security patches.
-
TIL Replace Only Fixes the First Encounter javascript mdn
Replace only finds the first occurrence. ReplaceAll fixes it all.
-
TIL Resume-Driven Development resume work
The selection of technologies is given highest priority in the current field of activity. Moreover, future employers and jobs may specifically be chosen according to these criteria.
-
TIL the difference between startups and stable teams work
On a stable team, you're working on handling features, patching up insecurities, and maintaining the ship. The ship is working. But someone still needs to do maintenance to keep it at sea. At a startup, you're fighting for your right to survive. This metaphoric ship is both at sea, while also being built. You're learning instantly to deliver immediately. (and for most startups, job security is often uncertain)
-
TIL reusing variables programming ruleofthumb
Do not reuse variables. Do not double define variables that represent the same thing.
-
TIL @Supports css defensive-coding
Unsupported CSS can break things. You typically wrap it in a @Supports rule.
-
TIL what a Shader is gamedev steam
Modern GPUs are incredibly flexible. Developers use shaders - to program the GPU to perform effects and complex rendering techniques. Devs write code in a shader language from an API (such as OpenGL) and a shader compiler in the video driver translates that code into binaries that your PC's GPU can run
-
TIL Optional chaining broke his mom's site apple javascript horror
Modern browsers get all fancy new features. But what about still-working technology like 1st-gen iPads and old chromebooks that no longer get updates?
-
TIL Cherry-picking out of bootstrap-vue javascript vue
If you are using a component library that uses ES modules like bootstrap-vue, you can cherry pick its components instead of just registering all of them globally.
-
TIL Avoiding promise chains javascript promises
Callbacks are functions that are executed when another function finishes. It can lead to callback hell, which instead, use a promise! But don't make promise chains
-
TIL use-cases for Generators in Javascript advanced javascript mdn
Generators are functions that can be exited and later re-entered. Their context (variable bindings) will be saved across re-entrances.
-
TIL Animista for generating CSS animations css generator
Animista is one of the best CSS tools you can use for animations. It gives you a collection of pre-made animations that you can use in your CSS.
-
TIL Memoization performance advanced javascript performance
Memorization in a nutshell: You catch the data if it exists already.
-
TIL John Romero had 74 games and 3 startups fail before making Wolfenstein 3D inspiration quotes
Before Wolfenstein 3D, John Romero had given himself something new to learn: random maze generation; joystick input; music.
-
TIL Microservice vs Monolith architecture dev
Final Verdict: You can do way more damage setting up a microservice architecture incorrectly in the long run than a really bad monolith.
-
TIL generating fancy waves for HTML generator css design
Get Waves is another amazing tool that will allow you to create SVG waves for your projects using CSS. It makes it much easier, you just choose the options, then the tool generates the right CSS code for your wave design.
-
TIL filtering DOM elements when you web-scrape web-scraping javascript
I love web-scraping. One core technique you have to master is stripping HTML from a string.
-
TIL about Leaflet, an open-source Google Maps alternative library open-source
I love how flexible Google Maps is for developers. But to use it for commercial products, it's a bit expensive. I learned about Leaflet — an open-source JavaScript library for interactive maps.
-
TIL event bubbling javascript codepen clicks
Event bubbling is when an event is in an element inside another element, and both elements have registered a handle to that event. That cause collisions.
-
TIL writing a clean function testing functional-programming
Write an assert at the beginning of the function. Then, write down all the conditions that must be met.
-
TIL about the proposed pipe operator javascript functional-programming
In functional programming, you chain functions to provide a result. Witht he Pipe operator, it can look like this: const total = money |> removeOneDollar |> addTwoDollars |> addFiveDollars
-
TIL how to use ':where()' css html
You can probably also use a helper class like `no-bullets`. But this method does follow a default top-down approach pattern with CSS that i'm starting to also fall in love with.
-
TIL different ways to inject content via Javascript html javascript
There's lots of ways to do things in Javascript. It gets difficult to know which way is the 'preferred' way.
-
TIL using Event Delegation javascript events
It's cheaper for the browser to track one event and fire it on every click that it is to manage multiple events.
-
TIL a sweet SVG clip-path generator svg generators webtools
The clip-path CSS property creates a clipping region that sets what part of an element should be shown. Parts that are inside the region are shown, while those outside are hidden.
-
TIL about going straight into the ask management remote teamwork
Don't ask to ask, just ask. Attention is a limited resource. If you work remotely, it's even more important to just get straight to the point.
-
TIL being a old developer old devstory
Every inspirational, blue-sky, brainstorming meeting or demo session has a person that keeps disrupting the flow. A battle-hardened, highly experienced developer with lots of memories of how things failed in the past. A person who a lot of people look up to and whose input counts as important. The even bigger problem is that this grumpy old person lives inside my head.
-
TIL Searching a static site static-sites search
Without a database to query for it, there's no built in-search query. Create your own search query system. (with a fallback where it opens up something like Duck Duck Go).
-
TIL prefers-color-scheme automatically css automation
For swapping between light mode and dark mode, you don't need JS. Using the `prefers-color-scheme`, that will automatically run the design code based on the user's preference.
-
TIL Why use Closures javascript freecodecamp advanced
Now you might be asking, why even use it? Why not just flatten it out so it's just one function with one return statement?
-
TIL Accessibility in Devtools accessibility devtools
You can enable the Accessibility Devtool (currently in experiments mode) to do screenreader testing.
-
TIL using html comments in javascript html comments badidea
This is in the 'bad idea' area! But just a need little factoid!
-
TIL the difference in the JS Event Loop for Browsers and Node javascript architecture
It took me years to understand this. Someone saying that 'they use Javascript' could mean they use Javascript on the web, or Node, or a different Javascript environment, of which there are MANY!
-
TIL Samuel L Jackson Lorem Ipsum generator placeholder
Probably not work-safe. But no more will you deal with boring placeholder text.
-
TIL a junior dev who programmed a World Heroes Genesis by himself gamedev history
Yeah, World Heroes (even the original) wasn't anything to write home about. I had to squeeze 82M into a 16M cartridge. The source code was in assembly with absolutely no documentation. There were no testers. There was no one to help me port the artwork.
-
TIL Clippy for generating clip-path art css generator
Clip-path allows you to define a shape that will determine what parts of your HTML element are shown. You can use it to create all different kinds of shapes!
-
TIL Promise Constructor edge-case javascript async
The promise constructor has to do a few more workarounds in order to catch errors. Just use a then statement
-
TIL How to auto-grow textarea with pure css css no-js forms
To do this, you replicate the content of the '<textarea>' in an element that can auto expand height, and match its sizing.Same font, same padding, same margin, same border… everything.
-
TIL Disable users from highlighting text html css accessibility
You can use the 'user-select' property to prevent an element from being highlighted by the user.
-
TIL more Javascript Environments javascript
This is back to why Web Interop exists! Because we have a specific Javascript standard (via ECMAScript Language Specs, by the TC39), and many many different companies/businesses who implement Javascript.
-
TIL Microsoft Teams can analyze your feelings ai security
Microsoft Teams set up a new feature set. They're known as Purview classifiers that can help prevent abuse, harassment, other illegal activities on Teams.
-
TIL Korok seed puzzle pattern gaming gamedev
Why I love this is that the designers thought up a few puzzle categories, and sprinkled the open world with these. It creates a very effective piece of optional game play.
-
TIL High Resolution Time gamedev javascript
The Date object is no longer the recognized method for timing events because it is very imprecise and can be modified by the system clock.
-
TIL about some sites to inspire you inspiration website
After years of web development, I've come to the conclusion that these sites are simply the most beautiful sites ever. If you ever need a inspiration, here you go.
-
TIL the Doherty Threshold click ux
If a computer responds to a users input in less than 400ms, the user will take less time to make their next decision.
-
TIL Number formatting with Javascript numbers javascript mdn
Say you wanted to convert this into a string, with all the commas and everything. You can use the browser Intl package to use this.
-
TIL refactoring object lookups to avoid looking at the prototype chain advanced javascript refactor mdn
Depending on your lookup method, you can access the prototype chain, which opens up some potential vulnerabilities or terrible side effects!
-
TIL tips for making a API Wrapper javascript reddit
The API wrapper should do zero 'interpreting' (or as close to zero as you can get).
-
TIL about heavy.js javascript mdn
It downscales all images on your webpage by a factor of 3, takes the RGB values and creates spans with appropriate styles. Yes, this converts your images to HTML p and spans.
-
TIL about semaphores javascript advanced programming
A semaphore limits access to a resource to some number of consumers. Any new requests for the resource will get stalled until later, eventually to be handled.
-
TIL cancelling promises javascript mdn
There is a cross-platform (Node, Browsers, etc) cancellation primitive called AbortController. You can use it to cancel functions that return promises rather than promises themselves.
-
TIL software interoperability api stackoverflow
The term 'software interoperability' refers to the capability of different solutions to communicate with one another freely and easily. Systems that are interoperable exchange information in real-time, without the need for specialized IT support or behind-the-scenes coding.
-
TIL the Shared Element Transitions animation css
These cool effects exist on mobile. And Google and the Chrome team has been pushing for the web to have those complex transitions too.
-
TIL Considering Device Obsolescence with web development webdev browsers
I'm incredibly guilty of pushing to build for the latest tech. For good reason too - you can write less code, use more native functions, and things are just more likely to work.
-
TIL constant failures inspiration quote
I've missed more than 9000 shots in my career. I've lost almost 300 games. 26 times, I've been trusted to take the game winning shot and missed. I've failed over and over and over again in my life. And that is why I succeed
-
TIL Morrowind would reboot the XBox if it ran out of memory and hide it behind a loading screen gaming hacks
One of my favorite tricks for Morrowind is that if you are running out of memory [on Xbox], you can reboot the Xbox without the user knowing. So if you had a really long loading time, that was us rebooting the Xbox.
-
TIL the WebCrypto API javascript mdn math
If you dealing with sensitive applications and need a more secure method of randomization, I’d recommend the Crypto API. Reasons you may want to use WebCrypto include temporary verification codes, random password generation, randomized lottery numbers, etc.
-
TIL another way to prevent buttons from submitting HTML button form javascript
When you have two buttons, you can use 'type=button' to stop them from submitting a form.
-
TIL asciinema terminal teaching
A frequent scenario that I use to teach my team is recording videos of doing terminal commands.
-
TIL the first computer bug history bug
On September 9, 1947, a team of computer scientists and engineers reported the world’s first computer bug. The team at Harvard University in Cambridge, Massachusetts, found that their computer, the Mark II, was delivering consistent errors.
-
TIL the @layer feature in CSS webdev css
With '@layer', the entry file can pre-define layers, and their order, ahead of time.
-
TIL ES6 Proxy's apply method javascript mdn advanced
Using JavaScript proxies you can wrap an existing object and intercept access to its attributes or methods, even if they don’t exist. You can also redefine fundamental operations for that object.
-
TIL ES6 Proxy javascript mdn advanced codepen
Using JavaScript proxies you can wrap an existing object and intercept access to its attributes or methods, even if they don’t exist. You can also redefine fundamental operations for that object.
-
TIL about the Clipboard API javascript mdn webapi
The Clipboard API can be used to implement cut, copy, and paste features within a web application.
-
TIL linux user groups permissions linux user
UID 0 is reserved for root user. UID 1-99 is reserved for other predefined accounts. UID 100-999 is reserved for system accounts. Also notice that user accounts tend to start at 1000. UID above 999 are for normal user accounts.
-
TIL Deceptive design patterns (dark patterns) ux browser webdev
Deceptive design patterns (also known as dark patterns) are tricks used in websites and apps that make you do things that you didn't mean to, like buying or signing up for something.
-
TIL how to explain Typescript like i'm 5 javascript eli5 typescript
Typescript is quickly becoming a powerful tool for Javascript developers. Typescript provides optional static typing.
-
TIL how to create randomware in nodejs security hacking node
As a developer, it's important to know the power we have in our hands, and how to execute and defend against it/avoid it. Running randomware attacks is illegal.
-
TIL the wbr element mdn html css
'<wbr>' is a HTML element that represents a word break opportunity—a position within text where the browser may optionally break a line, though its line-breaking rules would not otherwise create a break at that location.
-
TIL the original Pong was pure hardware logicgates reddit hardware
A simple gate example would be a OR gate. It gets two connections on the input side and 1 on the output side...
-
TIL about going up and down in your bash history commandline terminal security
Your bash history is saved with up/down arrow keys. Which means you shouldn't save your passwords on it.
-
TIL a short explainer of the Execution Context javascript javascript-advanced mdn eli5
It is an abstract concept that represents the environment in which JavaScript runs. What happens inside the execution context is two things basically. The first is parsing the code line by line and the second is storing the variables and functions into the memory.
-
TIL about this work of beautiful code cleancode javascript readability
I'm a strong believer in writing code for tomorrow's developer. I'm incredibly anti-code-golf. (It's a beautiful art form, but keep it out of production code!)
-
TIL the origins of the term Algorithms history math trivia
Muhammad ibn Musa al-Khwarizmi's name is a reference to where he was from — 'al-Khwarizm' means that he was from Khwarazm, a region roughly on the border of modern-day Uzbekistan and Turkmenista. Al-Khwarizmi was, somehow, recorded as something close to 'Algorizmi' which, in turn, became our all-purpose math word: algorithm.
-
TIL how images get displayed to the browser html spec image performance
Image data is usually encoded in order to reduce file size. You can change when to decode the image.
-
TIL CSS Vulnerability in Yahoo Mail css security vulnerability email
CSS doesn't immediately fail on parse errors. In 2009 it turned out Yahoo Mail was vulnerable to a fairly simple exploit. The attacker sends the user one email with a snippet of code and another email to run the code
-
TIL onError html error mdn
When a resource (such as an img or script) fails to load, an error event using interface Event is fired at the element that initiated the load, and the onerror() handler on the element is invoked.
-
TIL to minimize internally-made acronyms jobstory lifetip
Individually, a few acronyms here and there may not seem so bad, but if a thousand people are making these up, over time the result will be a huge glossary that we have to issue to new employees.
-
TIL add link decoration to help with accessibility links css accessibility mdn
One of the WCAG requirements is not to rely on color only when you want to distinguish a button or link from the rest of the text. Painting links in blue or another color doesn’t suffice since it still might not be visible for people with color blindness. The most typical method is underlining links; they can also appear in bold font.
-
TIL the global attribute translate html mdn
A good use-case is if your brand has words that can be translated.
-
TIL default spellcheck in html html mdn
The spellcheck is a global attribute that you can use to check spelling and grammar on HTML elements such as input fields and other editable elements.
-
TIL the multiple value in html html input mdn
The multiple attribute allows the user to enter multiple values on an '<input>'. It is a boolean attribute valid for file or email input types and the '<select>' element.
-
TIL how CORs work security vulnerability webdev
We kinda need images to work regardless of what site they're on. I should be able to steal a image from your website and host it somewhere else. Same with JS code (Like CDNs!) But we also don't want the problem above where I can test your cookies to see if you're logged into your bank account.
-
TIL adding an Event Listener to document javascript click performance
When an element in the DOM is clicked, the event bubbles all the way up to the parent element (the document and then the window). This allows you to listen for events on the parent item and still detect clicks that happen inside it.
-
TIL what jQuery's role is today jquery javascript
Today’s JavaScript frameworks allow us to break the UI into components, making it easier to scale up an application. It creates abstractions for easier synchronization between the data and the view. We don't need to hack the DOM element directly, and instead let the framework handle it.
-
TIL the history of jQuery jquery javascript
With the launch of jQuery in 2006, web developers were able to access and manipulate DOM and CSS faster and easier than ever before.
-
TIL an easy way to make rainbow text css colors
You can create gradient text by tweaking just three simple properties: background-image, color, and background-clip!
-
TIL a Accessible way to solve Read More accessibility links webdev html
Screenreaders help sight-impaired visitors have a better experience. The most annoying thing on a news website is to hear this: Read more — link, read more — link, read more — link. There's two ways to solve it.
-
TIL obvious security vulnerabilities and prototype pollution vulnerabilities security javascript
Object-based inheritance gives JavaScript the flexibility and efficiency that web programmers have come to love – but it also makes it vulnerable to tampering. Malicious actors can make application-wide changes to all objects by modifying object, hence the name prototype pollution.
-
TIL about Oil in Game dev gamedev video
It 'feels' wrong when Link gets stuck on a block. Nintendo is fantastic at 'oiling', smoothing out this process so Link automatically moves downwards when he hits a block.
-
TIL how to open up your webcam with html webdev input webcam
This is done with the 'capture' attribute which can take two values.
-
TIL Never deserializing untrusted data php security vulnerability json
This happened the most in PHP, because for some reason, PHP developers love to serialize/deserialize objects instead of using JSON, but I’d say almost every case we saw where a server was deserializing a client object and parsing it led to a horrible exploit.
-
TIL different ways to paginate API calls restapi webdev
When exposing large data sets through APIs, it needs to provide a mechanism to paginate the list of resources. That way, instead of 365,000 tweets shared... maybe you're sharing segments of 1,000 tweets. Smaller payload, faster delivery, less angry person.
-
TIL a funky bug that crashed Google Docs bug googledocs
On May 5, 2022... a user crashed Google Docs by typing: And. And. And. And. And.
-
TIL the different Javascript Engines javascript node
There's dozens of JS engines. V8 ,Chakra, Spidermonkey, JavascriptCore Webkit, JerryScript...
-
TIL blogpost - training new hires retrospective blog training newhire
A few months ago, I shifted from Wizbang Codemonkey to Lead Cat Wrangler (non-official titles obviously). My team went from six devs to thirteen in less than a year. And I would be in charge of managing a brand new team, as WELL as all the new hires. The Peter Principle is always a concern.
-
TIL how to create adaptive SVGs svg images html
SVG markup is XML using an .svg file type extension which allows it to hold more dynamic types of code. SVG is able to scale up and down without quality loss, and can potentially be very small in size, they can also have embedded CSS, even embedded media queries.
-
TIL about what causes Memory leaks in Javascript javascript advanced-js memory
As long as it is possible to reach it, keep it. Everything else gets yeeted.
-
TIL JS in Google Sheets excel serverless googlesheets javascript scripting
I like this because I do use a lot of Google Sheets, and I write a lot of Javascript. And together, they can be a quite a force to be... calculated.
-
TIL how Node/V8 works with imports/exports node advanced-js javascript
This is accurate only up to how JS works in Chrome-based browsers, and NodeJS, as Node uses V8 under the hood. But overall, it's referencing vs live binding
-
TIL Serverless Functions instead of a backend service serverless netlify
Back in the day, you had to spin a server. Now you can just throw it on the cloud.
-
TIL about Micro-frontends frameworks javascript webdev
Micro frontends are a new pattern where web application UIs (front ends) are composed from semi-independent fragments that can be built by different teams using different technologies.
-
TIL about Edios-Montreal's dialog system gamedev tools
These are the top-level goals the team needed to create with Codex. String IDs needed to be easily readable. Game scripts needed to be playable fast. Pain-free iteration. Ensemble recording. Fast audio importing. Easily provide context and error-checking for localization.
-
TIL these game design resources from Alex (@TychoBolt) twitter gamedev
These two massive docs that contain a wealth of info.
-
TIL the meta refresh redirect method html link
A Meta refresh redirect is a client-side redirect. Unlike 301 and 302 redirects that happen on the web server, a meta refresh redirect instructs the web browser to go to a different web page after a specified time span
-
TIL of the difference between || and ?? javascript boolean stackoverflow
The difference between || or ??
-
TIL about more examples of currying javascript advanced
Currying is nothing more than a way to transform functions that accept multiple parameters into a sequential list of functions that take only one parameter each.
-
TIL you can make your cursor display images css images
The cursor element allows you to use 'url()'. It's required to include a fallback keyword (like 'auto') in case the image is broken.
-
TIL how a url goes gets data from the internet browser network
Ever wonder what happens when you type a url in a address bar in the browser?
-
TIL some more examples of closure javascript closure
Five benefits- Private variables and methods. Data hiding and encapsulation. Currying. Function Factories. Performance
-
TIL about Partial Hydration javascript frameworks ssr
Partial rehydration is an extension of the idea of progressive rehydration where individual pieces of a server-rendered application are 'booted up' over time. This contrasts with the approach of initializing the entire application at once.
-
TIL about Interop 22 browser standard
interoperability — when each underlying web technology is implemented in the same way in every browser
-
TIL what Single Threaded & Non-blocking means in JS javascript advanced
Javascript is a single-threaded language. This means it has one call stack and one memory heap. Non-blocking means it'll read from top to bottom and throw anything async in the queue.
-
TIL a nice checklist/strikethrough animation codepen css
Animating checkboxes by using the `:checked` pseudo-class. If it's true, then include other things (like a before/after psuedo-class with other effects.)
-
TIL about the 11,000 line file devstory cleancode horror
At work, I discovered a core project file that is almost 4,000 lines of code. Code flowed from top to bottom. I thought this is what nightmares are made from.
-
TIL what the Diffie-Hellman Key exchange is algorithm security
SSH uses RSA to establish an initial secure, authenticated connection, then uses Diffe-Hellman to establish an ephemeral (ie: one time) key to establish forward-security.
-
TIL how to create a delay snippet for JS javascript performance
We check for any user interaction. The 'eventList' array has eventlisteners, listening to those movements. Or we wait 5 seconds. Then Switch the 'delay' attribute with 'src' attribute. Run the 'cookie.js' code!
-
TIL you can make SMS links sms html mdn mobile
So you can make a 'mailto:' and a 'tel:' link. But did you know you can also do 'sms' messages too?
-
TIL how to make numbers the same width and prevent shifting layout css fonts twitter mdn
If your font supports it, you can use 'font-variant-numeric: tabular-nums'.
-
TIL using datalist for a pure HTML input suggestion html input mdn
Web developers do not use the power of 'datalists' enough. It combines the power of a 'selector', with the ability to type out your choice using the keyboard.
-
TIL about the element.closest() method javascript codepen eventlisteners
Using a single event listener is super efficient, but has edge-cases. So using closest instead of match.
-
TIL some JS tree traversals dom jquery javascript
Ah, DOM tree traversal. It's the adventure that keeps on giving.
-
TIL of things to avoid at big companies job twitter
Being someone's lieutenant, Tribal knowledge, Falling for perks, Getting raises, not readjustments, Lack of recognition.
-
TIL how to set up autogrowing textarea fields form input mdn
There's some css tricks to autogrow textarea. There's also a nice piece of JS to use to do it as well!
-
TIL of a reference to quote the price of a website freelancing webdev
Look, you can live in a generic rental with popcorn ceilings, odor-catching rugs, paper-thin walls and the cheapest appliances. Or you can live in a nice apartment with 10ft ceilings, hardwood floors, soundproof walls and modern appliances.
-
TIL about IPv4 Private IP addresses ip certifications
The IP '10.0.0.1' is a Class A address. The IP '172.16.0.1' is a Class B address. The IP '192.168.0.1' is a Class C address.
-
TIL you can wire different inputs to different forms input form html
You can add the form element inside a input, to point specifically to the form you want to target.
-
TIL how my team used web components html spec blog
I'm sure this site is from like 2002 or something (I don't exactly know). This was a super quick task. And from the looks of it's age, we just wanted to get it done quickly.
-
TIL of what happens when you put a random url in your DNS records dns servers redirect
So when you use a 'A' record, it points to the IP address. If you put a site you don't own, and it gets redirects, it'll 404 because the header metadata!
-
TIL about Negative Caching dns sandbox stackoverflow servers
If you're ever working on a site and get a 'Server Not Found', then fix it (so that it totally works), and you STILL get a 'Server Not Found', that's negative catching!
-
TIL of using the "is" property css imgur mdn
The ':is()' CSS pseudo-class function takes a selector list as its argument, and selects any element that can be selected by one of the selectors in that list.
-
TIL about switching out of JS Classes and into JS Modules javascript oop classes advanced
A classes are just blueprints for creating objects. A class encapsulates data and functions that manipulate data. A module is a file that exports features, such as variables, objects, and functions, that can be used elsewhere.
-
TIL of this repo who made box shadow images codepen joke css
That's right! You can make a single-pixel box shadow. You can also create multiple versions on the same line.
-
TIL about Cypress Custom Commands testing cypress
Today I learned adding custom commands to Cypress to abstract common patterns, using the Cypress.Commands.add()
-
TIL how WordPress does serverside podcast wordpress serverside
This isn't fully accurate, but for the means of describing server-side rendering, it's a good start!
-
TIL about the End of Time! (for Unix) trivia datetime javascript
On January 19th, 2038 at precisely 03:14:07 UTC, instead of the clock going to 03:14:08 UTC, it will overflow and go to 20:45:52 UTC of December 13th, 1901.
-
TIL of a guide for naming things dev cleancode
Naming is hard. Naming is important because '.imgFloatLeft' no longer is accurate when we switch to 'ltr' format.
-
TIL of a visual way to see CSS Cascade css codepen mdn
But then questions start arising: is !important higher priority than say, the Shadow DOM generated object?
-
TIL how to quickly create a .nvmrc file node buildtools
all you need is 'node -v > .nvmrc' and let the magic happen
-
TIL about the Network+ troubleshooting methodology network
Honestly, it's one of those things where if you break down a real problem, you probably already do all of this.
-
TIL different Fiber Networks network certifications
My various notes on the Network+ exam for Fiber Networks.
-
TIL How to memorize certain IEEE 802 standards network certifications
The IEEE 802 is a collection of networking standards that cover the physical and data-link layer specifications for technologies such as Ethernet and wireless.
-
TIL Ethernet wire colors network certifications
Ethernet wires are more than just 'a cord'. It's 8 tiny wires.
-
TIL how to create tables in markdown markdown
To create a table in markdown, you literally draw a table out using pipes, and dashes.
-
TIL How to remember the OSI Model network certifications
Please do not throw Sausage Pizza, Asshole.
-
TIL Cell Phone technology and mobile phone generations network certifications
The various mobile phone generations and where we are now.
-
TIL Types of hacks and how to defend against them network certifications
On the Network+ exam, there were a few different methods of attacks. This is my notes on them.
-
TIL about Syslog Severity Levels network certifications
Syslog is a protocol to manage your network devices.It's a score from 0 to 7 to determine severity.
-
TIL ELI5 for Docker & Kubernetes docker eli5
Kubernetes is the service that manages all the docker containers to ensure there's enough resources for everything to operate.
-
TIL alternative open-source viewers for social media bypass open-source
A lot of websites require you to log in to use their services. Reading a twitter thread, and suddenly, you get blocked and have to log in. Not anymore!
-
TIL about Port 17, QoTD trivia
A host may connect to a server that supports the QOTD protocol, on either TCP or UDP port 17. To keep the quotes at a reasonable length, RFC 865 specifies a maximum of 512 octets for the quote.
-
TIL 404 errors actually have more specific causes trivia errors
IIS 7.0 and later versions define the following HTTP status codes that indicate a more specific cause of an error 404, like 404.1 - Site Not Found & 404.2 - ISAPI or CGI restriction.
-
TIL that Xbox has a accessibility Guidelines gamedev accessibility
The guideline also provides `gamer personas', types of gamers who are affected by that specific issue and how your accessibility solution will help them.
-
Grouping console messages together javascript devtools
You can wrap console messages together using console.group('name') and console.groupEnd('name')
-
TIL about console.assert() javascript devtools
You can instead use console.assert() to show conditional errors
-
TIL about wrapping a variable in curly brackets devtools javascript
Output the key:value pair using curly brackets
-
TIL how to replace many characters in javascript mdn regex javascript
You can use the replace() method to swap one string pattern for another.
-
TIL about 'chumps' in BioShock gamedev hacks
In Bioshock Infinite, they have 'chumps' without AI, without the ability to pathfind around - just bodies looping animations with a few flourishes like voice lines.
-
TIL about some neat notepad tricks windows timestamps
'F5' generates a timestamp in notepad. And adding a timestamp using .LOG on the 1st line of a text file.
-
TIL about the Network Information API browser api networks
The Network Information API provides information about the network types(e.g., 'wifi', 'cellular', etc.), save data mode, bandwidth and many more.
-
TIL ELI5 for GraphQL browser graphql apis
ELI5? It's like a lunch tray, properly portioned and asking for a specific food type in each slot.
-
TIL about getting how long it takes for JS to execute performance javascript
This post took me 7.22 minutes to write.
-
TIL about the battery status API mdn browsers api
Do you want to know all about the battery of your laptop, PC or, devices? This API helps in knowing all the information like, the battery is charging or not, how much charge is left and also the handlers to handle the charge related state changes.
-
TIL Spreading a object into another object codepen javascript
It's copying an object into another object, while also adding a new input.
-
TIL Blogpost, What New Hires think about blogpost culture newhire job
New hires come in with a lot of unknowns. They also don't have psychological safety to open up.
-
TIL about the Broadcast Channel API javascript browser
Think of a use-case like, once you logout from an app running in a browser tab, you want to broadcast it to the app instances opened in other tabs of the same browser.
-
TIL ELI5 for Async Await javascript eli5
If you make a call to a friend across the world, it'll take 20 seconds before they respond. You can't just wait 20 seconds. So you run other code.
-
TIL that 2^24 items will cause a interesting error math javascript errors
Obviously there's not much real use-cases. But that's the fun of finding limitations.
-
TIL about the Image Capture API browser apis javascript
The Image Capture API which helps us to capture an image or grab a frame from the video devices(like webcam). Not only that, you can also perform actions on capturing an image or grabbing a frame.
-
TIL about a a 12 year old bug that finally get's squashed. wordpress history bugs
Someone noticed a potential optimization issue, and the technical debt piled on thanks to new features, encapsulating them for reusability, then calling them over and over.
-
TIL about joke variables names in WordPress wordpress jokes
The vast majority of users are likely unaware of this joke unless they enjoy trawling through the 6,000+ lines of code in '/wp-includes/formatting.php'. There is a good chance that any developer who has looked up the 'wpautop()' function has stumbled upon it.
-
TIL how to add custom styles in WP Blocks wordpress css
Justin Tadlock of WPTavern recreates a theme in block patterns.
-
TIL ELI5 for Dependency Injection programming eli5
In a nutshell, what it means is that any given piece of code you write should be provided everything it needs to do its job, instead of creating things for itself.
-
TIL of this switch shorthand javascript
Using a switch statement to fire a function? Nah, just fire it.
-
TIL ELI5 for Smoke Testing testing eli5
It's about doing some basic surface level tests. If any of them are goofy, then something is wrong.
-
TIL how to convert a nodeList into an array javascript browser
You can use the spread operator to turn a nodelist into an array!
-
TIL how to pass unlimited arguments to a function mdn functions javascript
The rest parameter syntax allows a function to accept an indefinite number of arguments as an array, providing a way to represent variadic functions in JavaScript.
-
TIL using live regions for autocomplete accessibility accessibility javascript autocomplete
However, the screen reader does not recognise this as an action to tell the user about. It will announce the header and the input box when they gain focus, but not the search results.
-
TIL how to get the location of the user with the Geolocation API mdn browser javascript permissions
You can get the user's location in the browser. First, the user has to accept this. As it's a security request. Second, you use the Geolocation API.
-
TIL a easier way to check for multiple OR statements logic booleans
Essentially, it's turning a multiple conditional into a array, then array to see if it matches.
-
TIL about Debouncing/throttling programming eli5
Debouncing and throttling are too common techniques for dealing with things that happen 'too often', like typing.
-
TIL of someone who missed all the JS pitfalls javascript devstory
If JS doesn't do it the way they think it works, then... JaVaScRiPT is STUPID!
-
TIL about the new Intl.NumberFormat browser API javascript browser mdn
No more stupid-ass hacks to format numbers correctly.
-
TIL Chrome can emulate mobile hardware browsers emulation mobile
Chrome can emulate device hardware in DevTools — choose Sensors from the More tools menu
-
TIL of a nice ELI5 of code splitting programming webpack eli5
Code splitting is the splitting of code into various bundles or components which can then be loaded on demand or in parallel
-
TIL How to determine what security group you're in linux permissions terminal commandline
These commands will help you figure out what group you're in, and if you belong to the group that can modify files.
-
TIL the word Sanitize is too overloaded xss security language developer
Sanitize means too different things, depending on context. Use Filtering, Escaping, Validation, or Protect instead.
-
TIL the one-banana problem dev-history developer humor
Banana problem: Supposedly from the notion that a trained monkey could do what is required. At IBM, they divided the world into one, two, or three banana problems.
-
TIL this glorious website - No Hello dev comic workplace
Nothing worst than the dreaded 'Hello', followed by silence. Just start talking.
-
TIL the Bus Factor programming idioms
The bus factor of a project is the number equal to the number of team members who, if run over by a bus, would put the project in jeopardy. If a project overly relies on the contributions or knowledge of one person, then you could say that the project’s bus factor is one.
-
TIL trailing commas in Javascript mdn linter cleancode
JavaScript has allowed trailing commas in array literals since the beginning, and later added them to object literals, and more recently, to function parameters and to named imports and named exports.
-
TIL you can share multiple users between WordPress installations wordpress cms user-tables
You can use the same userbase for all your blogs on the same domain by defining the CUSTOM_USER_TABLE and optionally the CUSTOM_USER_META_TABLE constants to point to the same wp_your_blog_users and wp_your_blog_usermeta tables.
-
TIL more scary floats in Javascript integer javascript advanced-js
using floats with parseInt can cause unexpects side effects
-
TIL World of Warcraft had a Developer Island in production code gamedev hacks
This developer island was only for devs, and was used because some bugs couldn't be reproduced on dev servers
-
TIL this bug that deleted all /usr stuff linux commandline terminal woops bug
Classic mistake where the dev wrote a rm -rf that deleted the folder
-
TIL how to append a date to a filename in Node node filename
My goal was to create a helper function that allows me to build a new file, and append a date to a filename for logging.
-
TIL getting all files with an extension in Node using Glob node file-directory
This helper function to get all the files that end in a specific extension in node
-
TIL unzipping a file in node using zlib node compression automation
Since my application needs to read whatever is inside that '.gz' file, I had to figure out a way to simplify that. That was done with zlib.
-
TIL startWith mdn javascript string
Getting a boolean result of true or false, depending on if the string startsWith a specific substring
-
TIL a quick recipe involving Axios and Cheerio web-scraping javascript fetch recipe mdn
A quick recipe to http request an api and use cheerio to web-scrape it
-
TIL doing things that makes your team's lives easier work devlife
What can I do to make my team (team lead, teammates, managers, other teams) lives easier?
-
TIL about AutoHotKey automation gaming
When you're getting annoyed at running the same commands over and over again.
-
TIL How to highlight specific lines in bitbucket git url bitbucket
You may want to highlight specific lines in bitbucket by using #lines-1,2,3
-
TIL How a virtual dom works virtualdom dom react vue
Then, the Virtual dom compares diffs from old virtual dom, and then reapplies it. We apply the minimal amount of changes.
-
TIL Blogpost - These 6 rules created a really dope culture at my job jobstory culture blog
In almost any televised sport, watch the players. Teammates high five. Win or lose, opponents say 'good game'. Players tend to be good sports. It's rare to seeing players belittle a fellow teammate. Because at the end of the day, it's just another day. It's just another game. There's a thousand more. And another opportunity to shine.
-
TIL Vue's Render Function vue render advanced
A good example is that you want to generate a lot of list items, and writing them in the '<template>' section makes it look like spaghetti.
-
TIL that keyCode is depreciated depreciated mdn keyboard
KeyboardEvent.keyCode is depreciated. Because it was inconsistent. Use a the code version instead, it's more readable.
-
TIL a JWT decoder and how it works security json jwt
JWT (JSON Web Tokens) are essentially just JSON objects that are hashed. This site decodes them and explains how it works
-
TIL end all node processing scripts javascript commandline terminal bash node stackoverflow
killall node - a sure fire way to kill a node.js server that won't stop running.
-
TIL web dev debugging parameter trick url params debugging
You probably shouldn't do this on prod, but you can add debugging mode to allow for specific features. Something like: site.com?debug
-
TIL the Rule of Three for Refactoring refactoring junior rule dev
The first time you run into a problem, solve it. The second time, just copy it. The third time, then you make that consideration.
-
TIL that monorepos are so big and can't be used in git git monorepo codebase
Git literally cannot handle all that code for those companies. So they rolled out their own. (With blackjack and hookers)
-
TIL Dan Abramov's 100 things twitter devtips
100 things from Dan Abramov. This post has a few of my favorites.
-
TIL writing modes accessibility rtl css mdn
The 'writing-mode' CSS property determines if lines are laid our horizontally, or vertically. The direction is determined by the context of the direction of the content.
-
TIL the hover media feature css mdn media-queries
If you're on a phone or tablet, chances are -- you cannot hover. But if you're on desktop using a mouse -- you can!
-
TIL map() only when you need it javascript performance loops
The origins of 'map()' was to create methods that allow us to manipulate array data without mutating it. It's part of the whole set of methods to make functional programming easier in Javascript.
-
TIL A nice way to use calc to get margin space css layout
I love it when bootstrap containers automatically create padding based on size.
-
TIL solving the this keyword and it's execution context javascript advanced
The this keyword references the current execution context of the function from where you’re calling using it. If it's used in a regular function, a arrow function, or a method changes the execution context of this.
-
TIL Writing really good alt text accessibility images copywriting
One way to think of alternative text is to think about how you would read the page containing the image to someone over the phone, without mentioning that there is an image present. Whatever you say instead of the image is typically a good start for writing the alternative text.
-
TIL that it's ::before, not :before css
So what should you be using? Unless you time travel, double-colon.
-
TIL converting Booleans to Numbers helpers javascript
This helper is great for APIs. Not every language parses true/false the same. But every language knows that 0 is false, and 1 is true.
-
TIL Microtask Queue vs the Call Stack Queue advanced javascript
When everything is done from the 'Call Stack', the Event Loop finds some new tasks to go after. It'll dig through all the 'Microtasks queues', then in the 'Macrotasks queues'.
-
TIL Layers in CSS css specificity
CSS goes through a lot of passes to determine style orders. Make the css more specific, and it takes priority. Add a '#', and it takes even more priority. Add a freakin' '!important;', and hurray, you're at the top.
-
TIL Accessibility changes and dynamic content accessibility
Using JavaScript, it is possible to dynamically change parts of a page without requiring the entire page to reload. But the result is that pages with accessibility issues do not return the value.
-
TIL doing a reverse-search history in bash terminal search
Your bash history is saved with up/down arrow keys. Which means you shouldn't save your passwords on it. But you can use Ctrl+R to open up a search prompt.
-
TIL of a console.log way to avoid [object object] javascript object node
you can use JSON.stringify to get a object.
-
TIL Rule of Three in Refactoring programming
Follow the Rule of Three. It makes it easier to find correct abstractions. Ignore the first. Duplicate the second. Refactor when you see it a third time.
-
TIL a fancy word for auto-generating objects, A Factory Function programming patterns
So a factory function creates objects. That's all.
-
TIL the Two Types of People and Why Pair Programming works frontend-masters quote
The 'Researcher' & the 'Stack Overflower' - Neither is effective in its own isolation, both are necessary to being an engineer, you've done this in the first year of your careers, both of these.
-
TIL JS Coercion javascript edge-cases ecmascript
In JavaScript, the + operator is used for both numeric addition and string concatenation. When you 'add' a number to a string the interpreter converts your number to a string and concatenates both together.
-
TIL default template choices in WordPress templates wordpress
This is a list of template pages that you can add in your custom-theme. It's a really nice feature that WordPress has built-in.
-
TIL I'm done with FontAwesome html css library blog
When I first discovered FontAwesome in 2013, I like everyone thought the same thing -- this is a MAJOR game changer. It is now 2022. As I look back, FontAwesome has become unsustainable.
-
TIL You can change the blinking line css inputs mdn
The caret-color CSS property sets the color of the insertion caret, the visible marker where the next character typed will be inserted. This is sometimes referred to as the text input cursor.
-
TIL CSS pseudo-element first-letter, to make a Drop Cap css html
You can add a drop cap to a paragraph by using the ::first-letter pseudo-element.
-
TIL Avoiding dependencies in your helper functions helpers javascript testing functional-programming
Impure functions for helpers? What is this... 1999?
-
TIL Find unused JavaScript javascript devtools optimization
Chrome's Coverage panel allows you to quickly locate JavaScript (and CSS) code that has — and has not — been used. To start, open Coverage from the More tools sub-menu in the DevTools menu
-
TIL Blocks Vs Themes Style responsibility in WordPress wordpress
In WordPress Full-site editing mode - Who manages CSS styles? Blocks or Themes? Well, a bit of both!
-
TIL Getting parent data from child component vue components
Sometimes we want to access data from a parent, but don’t want to go through the hassle of passing props.
-
TIL setTimeout, blocks, closure interview-questions stack-overflow closure
setTimeout is creating a closure function. More importantly, vars get yoinked by closure, where lets create their own block scope.
-
TIL Declarative Vs Imperative Programming Paradigms programming paradigms
Declarative Programming is like asking your friend to fix your car. You don’t care how to fix it, that’s up to her. Imperative Programming is like your friend calling your father that tells her how to fix your car step by step.
-
TIL adding a debug flag for custom features debug url-parameters
Creating your own ?debug flag in your url to do some sweet debug stuff
-
TIL checking falsy values inside an array array javascript
Using the key Boolean to find any true/false statements inside an array
-
TIL Adding Tooltips without a library html ui
You can add tooltips without a library by adding a title attribute in any html element
-
TIL the Download attribute in links html
href="link/to/your/file" download="filename.pdf" to make your links auto-download
-
TIL how to turn anything into a editable text html
So you'd use a 'input' or 'textarea' field to create a space for the end user to add new content. Did you know you can also do with that almost any element?
-
TIL that it's not a pop-up, be more precise pop-up ux webdev
Teach others to stop using pop-up. It means like 10+ different things.
-
TIL a neat way to clone and object and override the items javascript objects
Spread the object into a new object, then override the element later.
-
TIL mutations and how to sort without mutating javascript functional-programming arrays
Mutation isn't bad. It CAN cause side effects and ruin your life. There's times when you want to have your objects mutate. For everything else, switch to functional programming and passing the data.
-
TIL You can dynamically name objects javascript objects
Not all Object keys have to be hard-coded strings. To make it dynamic, use [brackets].
-
TIL a clean way to add classes based on the page in Vue clean-code arrays vue
If your pages exist in a array, use the includes() to check.
-
TIL that it's normal to feel embarrassed by your code quotes podcast code
If you wait till you’re not embarrassed about your code to show your code, you’ve waited too long.
-
TIL adding properties conditionally using the spread syntax objects javascript conditionals
You can conditionally add properties to objects by ... in there.
-
TIL about Code Golf coding abstraction
Stop with the code golf. My blood level rises every time I see code that tries to reduce character count.
-
TIL How to check if the string is uppercase js text
The magic is comparing str === str.toUpperCase()
-
TIL JS commas evaluate operands javascript interview tricky
The comma operator evaluates each of its operands (from left to right) and returns the value of the last operand. var a=(2,3,4,5,6,7), result is 7.
-
TIL when to use SOLID in 2021 programming solid
SOLID is an acronym for 5 principles. But they were made when dinosaurs roam the earth.
-
TIL Technical Debt isn't a problem, it's a tool tech-debt good-dev
t's a very junior-level thing to assume all technical debt is bad. It's like assuming all debt is bad. Senior devs know how to make trade-offs.
-
TIL match expression (like switch) php clean-code
Use the match($var) method to filter the results to exactly what you want.
-
TIL how to remove a event listener js events
Maybe you have a situation where you only want the event to fire once.
-
TIL Scribblenauts isn't math, it's hand-crafted game-design
Most people believed that this impressive system was the result of complicated math, but according to one designer, the real secret was hand-crafting.
-
TIL Optional Chaining in PHP8 php js
Optional Chaining in PHP looks very similar to optional chaining in JS
-
TIL the DOM and CSSOM css html web-development
DOM is the html. CSSOM is the design. Together, they become... WEBPAGE-PERSON.
-
TIL Javascript Vs Typescript cheatsheet javascript typescript cheatsheet
A easy-to-print sheet pointing out the difference between the two.
-
TIL Adds days to a date javascript dates
Maybe you just need some quick date math, and don't want to use a date library.
-
TIL the Door Problem game-design
The door problem is all the questions you have to answer just to get a door in a game. As a frontend developer, the work I do is about turning a mockup into a working website. Door... button... same problem.
-
TIL SSG vs SSR vs CSR serverside serverless nextjs
SSG means Static Site Generation. SSR means Server Side Rendering. CSR means Client Side Rendering.
-
TIL how Wing Commander shipped with a clever hack video-game-history
Error when you quit? Change the error message!
-
TIL Grouping Event Handlers cleancode event-handlers javascript
Group your event handlers together for that sweet cleaner, fresher code.
-
TIL Web Component two-up web-components html
I think there's still a world where it can exist. We just have to find a right way to do it.
-
TIL Pure and Impure Functions functional-programming javascript clean-code
A important piece of Functional Programming is creating Pure Functions. NO SIDE EFFECTS
-
TIL that there was a menu element in prior HTML versions history html web-development
There was a menu element that we replaced with ul and li elements
-
TIL all functions create a empty prototype object javascript classes advanced
When you create a function in JavaScript, it automatically creates an empty container called prototype for you to stick your methods into.
-
TIL how to get a list of all globally installed npm commands npm terminal
Well, you probably installed it globally. I was curious on what other global commands I installed. 'npm list -g --depth 0'
-
TIL Value as Number mdn inputs forms
Returns the value of the element, interpreted as one of the following, in order: A time value, A number, NaN if conversion is impossible.
-
TIL difference between document.hidden vs document.hasFocus() javascript visibility stackoverflow
Do you need to check if the tab is currently active/Visible?
-
TIL oncontextmenu feature for right-clicking javascript events
The oncontextmenu property lets us assign an event handler function when the right mouse button is clicked on the browser tab.
-
TIL writing cleaner If statements javascript cleancode ifstatements
Graphs and visual flow of various if-else statements
-
TIL using Flexbox column-gaps css flexbox
Using Column-gaps lets you space things out correctly, AND properly lays out your container elements.
-
TIL Scroll to the top of the page javascript
A neat trick to create one of those 'To the top' buttons!
-
TIL toLocaleDateString that's built into Javascript for dates date javascript mdn
Date().toLocaleDateString('en-US') returns a string with a language sensitive representation of the date portion of this date.
-
TIL Event Listeners in devtools javascript events devtools
Today I learned that you can identify the Event Listener directly in the Devtools!
-
TIL lighthouse scores are simulations, not real world seo devtools
So if you run Lighthouse on your high-powered developer machine and get great scores, that may not be reflective of what the users experience in the real world, and so what Google will use to measure your website user experience.
-
TIL what bash means bash terminal definition
Bash means Bourne-again shell. sh was proprietary and not open source, and Bash was created in 1989 to create a free alternative for the GNU project and the Free Software Foundation. Since projects had to pay to use the Bourne shell, Bash became very popular.
-
TIL about making better presentation slides slides presentation
If you're going to have code on your slides, make sure it's the least amount of code necessary to convey the same meaning.The attendees came to listen to you, not to read.
-
TIL CSS variable tricks css javascript variables
If you want to change the background with Javascript, you can use a CSS variable.
-
TIL more about destructuring javascript cleancode
Destructuring allows us to extract values from arrays and objects and store them in variables with a more convenient syntax.
-
TIL why NodeJS in reference to I/O javascript node definitions
Node.js uses an event-driven, non-blocking I/O model that makes it lightweight and efficient. tl;dr: bypasses JavaScript single-threaded event loop
-
TIL How to actually do CSS Shadows css design ux
A real world shadow has two main distinctive parts. Direct light casts the first shadow and ambient light casts the second.
-
TIL Netflix' Paved Road products netflix projectmanagement
The Paved Road is a concept in Netflix that allows their teams to use a product or tool that is sort of default for the rest of the company. The product/tool is produced internally and managed internally.
-
TIL Netflix's method of providing internal tooling at scale security netflix operations
Netflix had a problem. Before any program can be deployed, it had to run through a rigorous security checklist.
-
TIL LocalForage, a small js library for caching javascript webdev cache api mdn library
An easy to use library to help with web storage. Switches between localStorage/sessionStorage, and also IndexedDB automagically. 178,000 repos can't be wrong.
-
TIL hoisting based on function declarations & function expressions javascript advanced
Function declarations get hoisted on load. So you can use it anywhere. Function expressions do not. Neither are better than another
-
TIL about Tmux and persistent terminals linux raspberrypi terminal ssh
Tmux lets you start a terminal session and then open multiple windows inside that session. Tmux sessions are persistent, which means that programs running in Tmux will continue to run even if you get disconnected.
-
TIL the Singleton Pattern is hotly debated booksummary 97things patterns
Singleton Pattern is useful when exactly one object is needed to be used as a global instance to coordinate across the system. But it got problems.
-
TIL The Single Responsibility Principle booksummary 97things
Gather together those things that change for the same reason, and separate those things that change for different reasons... if it makes sense.
-
TIL being a good teacher quotes
A good teacher does not teach facts, he or she teaches enthusiasm, open-mindedness and values.
-
TIL not ignoring errors errors
Doing nothing with a caught error doesn't give you the ability to ever fix or react to said error.
-
TIL how to force-quit in Linux Terminal linux raspberrypi terminal
I was goofing off with my raspberry pi and broke something. Then I used ps, and then kill -9 12345 to kill that app.
-
TIL How to set up Archi Steam Farm on Raspberry Pi raspberrypi steam
Archi Steam Farm and a tampermonkey script can auto-farm steam cards then sell them.
-
TIL KISS (Keep it simple stupid) booksummary 97things development
I'm a fan of Keep it Stupidly Simple (KISS) (There's other ways to interpret the the last part).
-
TIL the value of a good comment booksummary 97things comments
Inside your code should be explanations about what the code is supposed to be doing. On the other hand, you can go too far in your commenting. Make sure that your comments clarify your code but do not obscure it.
-
TIL Compound Components in React react kentdobbs components
Compound components, where you combine parent/child data.
-
TIL the difference between throttling and debouncing javascript events
Throttling enforces a maximum number of times a function can be called over time. Debouncing enforces that a function not be called again until a certain amount of time has passed without it being called.
-
TIL how competitive shooters make maps gamedev maps
For multiplayer fps games a la counterstrike, use node graphs.
-
TIL how a dev cut GTA Online load times by 70% gamedev optimization videogames
In all, t0st estimates that 1,984,531,500 checks take place (nearly two billion!), again taking up a ton of CPU time.
-
TIL about massive re-writes vs write-in-place lessonlearned devstories
There's two schools of thinking when it comes to rebuilding a project.
-
TIL How annoying interviews can be lol algorithms interviews
For web developers, the're a neat parlor trick. Interviews should just do away with them.
-
TIL how Javascript passes data by value, not by reference javascript primitives gif
In JavaScript, primitive types like Number or String are passed by value, not by reference.
-
TIL rimraf, a rm alternative node terminal
rm is platform specific (and certainly will not work on Windows) and rimraf deals with this for us.
-
TIL dealing with office politics job officepolitics comments reddit
One of the things not talked about often is office politics. Not just about identifying issues with tasks, but also figuring out how to handle issues within coworkers/team dynamics.
-
TIL How to exit out of a node script node errorcodes
If you write a node script, you can terminate it by Ctrl+C, or forcing a quit within the script, or using the process.exit()
-
TIL find() vs filter() javascript arrays
`find()` method return the first value which match from the collection. `filter()` method returns the match value from the array.
-
TIL Technical Writing writing dev teaching
The goal of good technical writing is to explain in clear terms what a API is about, or how this piece of software works.
-
TIL A server malfunction took down a whole MMO permanently gaming servers
This screams 'We didn't have source control or code management'.
-
TIL using code-splitting to improve your First Contentful Paint (FCP) score javascript seo esmodules webpack vue react frameworks
Code splitting is a technique where you send only the necessary modules to the user in the beginning.
-
TIL that sometimes, simplicity is best kiss meme
As developers, we want to write clean code and readable code and functioning code and code that just works.
-
TIL super keyword in Javascript classes javascript classes mdn codepen
the super keyword is mainly used when we want to access a variable, method, or constructor in the base class from the derived class.
-
TIL how to see if terminal commands exist terminal commands
Use the 'command -v' to see if the command exists. For example: '$ command -v git'
-
TIL using Object.freeze to simulate enums in Javascript javascript datatype objects
Enums are useful to assign names to the integral constants which makes a program easy to read and maintain. The keyword 'enum is used to declare an enumeration.
-
TIL Jitter in audio/video conference calls audio video data
Jitter (network jitter) is when the delay time (ms) of data packet transmissions starts varying. It is not the same thing as latency (delay), which is the time it takes for packets to go from one point to another.
-
TIL about Constraint Validation API (forms) forms html css mdn
Inputs are pretty powerful. Right out of the box, they can autocomplete, validate data, create minimum/maximum lengths, allow for patterns, and even provide state!
-
TIL the vitality curve (aka Stack Ranking) management work amazon
A vitality curve is a performance management practice that calls for individuals to be ranked or rated against their coworkers.
-
TIL not using the delete keyword for performance issues javascript objects performance
The delete keyword is used to remove a property from an object. Apparently, there is performance issues with `delete` with V8 Javascript Engine.
-
TIL Optimizations with closures javascript closures optimization
To reduce the number of times a variable gets computed, you can use closures. Closures work by storing references to the outer function’s variables. They do not store the actual value.
-
TIL the difference of Closures in Javascript vs PHP php javascript closure
I never knew PHP and Javascript closures were different.
-
TIL the history of the for, forEach, and for...of loops arrays javascript
for loop came first. Then forEach. With new iterables, for...of was adopted.
-
TIL spreading an array into another array javascript arrays
So to merge an array, use the spread operator. '...' <-- that guy
-
TIL Mono Repo best practices git
In a monorepo, there's a lot of architectural decisions. One major decision: Do you compile each repo and leave the dist?
-
TIL Deconstructing Objects javascript codepen objects
Rather than create a big list of parameters in your function, pass the whole object and deconstruct it.
-
TIL the benefits of standup agile dev
Standups are actually useful for keeping an eye on the newbies.
-
TIL /usr doesn't stand for user, but User System Resources linux trivia
This directory contains most commands and executables files, libraries and documentation. In the early days of Unix, it was the directory where the users' home directories were placed
-
TIL how the old generation of engineers thought about their code quotes book history
At it's core, all engineering was about making trade offs between the perfect and the workable.
-
TIL about some key elements of NestJS javascript node framework
Controllers, Providers, and Modules OH MY!
-
TIL an Email Address Regular Expression that 99.99% works regex email validation
This is probably the closest we can get to the most perfect regex for validating emails.
-
TIL ES modules and dynamic imports javascript es-modules
Did you know we can also dynamically load modules based on conditionals? The import(path) returns a promise, it fits great with the async/await syntax.
-
TIL a clean way to refactor if/else statements javascript
Not using if-statements gets you closer to the code-as-data concept
-
TIL that you can chain if/else using ternary conditionals javascript
Chaining Ternary conditionals are really neat
-
TIL the Heisenbug dev
In computer programming, heisenbug is a classification of an unusual software bug that disappears or alters its behavior when an attempt to isolate it is made.
-
TIL a one-page guide to a bunch of terminal commands I use frequently terminal
Developers work in the command line frequently.
-
TIL functions should only do one thing cleancode javascript
The most important rule of programming is - break your code into tiny bite-sized pieces. That makes it easier to compose, test, and add it.
-
TIL there's actually a official guide for how HTML is implemented html
Enjoy arguing about HTML standards and realize the MDN isn't cutting it? Well I have a solution.
-
TIL iframe sandbox attribute html javascript
The iframe HTML element represents a nested browsing context, embedding another HTML page into the current one. There's also a sandbox mode.
-
TIL Automatic Semicolon Insertion javascript
JavaScript has a 'automatic semicolon insertion' rule. It happens if any of these three scenarios occur.
-
TIL about this method to generate infinite Utility Helpers with CSS css
Generating tailwind-like utils.
-
TIL SmooshGate javascript history
It was a a proposal for a JavaScript language feature called `Array.prototype.flatten`.
-
TIL what ES modules are javascript
ES Modules (ESM) is the official, standardize module system to Javascript. What the heck does that mean?
-
TIL HTML's native hidden attribute html css
To hide a DOM element: there's a native HTML attribute called `hidden`.
-
TIL a easy way to generate a lot of fake numbers javascript arrays
You need lots of array elements. You got it.
-
TIL why emojis in JS counts as a length of 2 javascript fonts
Characters are written in UTF-16. Emojis are bigger, and require two characters.
-
TIL how big the Internet Archives are internet
I don't actually have an answer. But as of a 2021 presentation, they grow by about 5-6 PB per quarter.
-
TIL why NASA will not be able to have usable spacesuits history
The answers were mostly because the space suits of the past were made in a specific way that we can't replicate without building it from scratch again.
-
TIL how to make mobile devices vibrate javascript mobile
The Navigator.vibrate() method pulses the vibration hardware on the device, if such hardware exists.
-
TIL this bash script bash dev
I share this bash script because it's really easy to read, and a reminder that all langauges are kinda built the same.
-
TIL mysterious with keyword in Javascript javascript obsolete
There's a lot of ancient Javascript code that you really shouldn't use, like with
-
TIL when to use local storage vs session storage javascript
We already have the `local storage`, why would we want to use the `session storage`?
-
TIL how devs can explain what needs to happen influence
If we’re attempting to convince someone to try something, we should try to empathize with the people we’re presenting to.
-
TIL Eliminating duplicate objects javascript
Using `Set` datatypes can let you do this with no fuss.
-
TIL use JS filter like a pro javascript arrays
To remove falsy items, we use `.filter()` `(Array.prototype.filter())`
-
TIL how to check if the value is an array javascript
If the value is an Array, true is returned; otherwise, false is.
-
TIL even professionals forget things dev
It's nice to be reminded that even the professionals forget basic things.
-
TIL How to convert a jQuery plugin to Vanilla JS javascript
To use [Lettering.js](http://letteringjs.com/), which is a reallky neat library, you need to bundle jQuery with it. How about not?
-
TIL array fill references the same object in memory javascript gotchas
When you use `array.fill` to create inner arrays, it's actually just referencing the same space in memory.
-
TIL the XOR operator in Javascript javascript math
The operands are converted to 32-bit integers and expressed by a series of bits (zeroes and ones).
-
TIL how to Make a Square with CSS with aspect-ratio css
The first figure is for the top and bottom dimension, the second is for left and right.
-
TIL How to math the 6 minutes(s) ago without a library javascript dates
Sometimes you need something to print a date to '6 minute(s) ago', but don't want to import monster-size libs.
-
TIL Observer Pattern patterns
The observer pattern defines a subscriber method, which will update every object that is subscribed to itself, making sure every subscriber gets the latest update.
-
TIL Singleton pattern patterns
Singleton is a creational design pattern that restricts class to have only one instance, while also creating a global access point to this instance. It is used when control access to a shared resource is needed.
-
TIL Labels in Javascript javascript
The 'labeled' statement can be used with break or continue statements.
-
TIL prohibit inserting text forms javascript
You may want to prevent the user from pasting text copied from somewhere in the input fields by calling its method preventDefault().
-
TIL Disable pull-to-refresh on mobile css mobile
By default, mobile browsers tend to provide a 'bounce' effect or even a page refresh when the top or bottom of a page (or other scroll area) is reached.
-
TIL column-count css codepen html webdev
Using the column-count property you can break an element's content into a specified number of columns.
-
TIL the time Silicon Valley thieves stole GPS trackers humor
Silicon Valley thieves ade off with $18,000 worth of high-tech equipment – unfortunately for them, about 100 GPS tracking devices were among the items taken.
-
TIL Safari's one-off problems css mac
Safari is the new IE when it comes to web development. All the one-offs you will face
-
TIL ES2021 - plus(+) operator as an alternative parseInt & parseFloat javascript
You can use the + operator in front of any numeric string to parse it as a number.
-
TIL to refresh your Cypress test testing
A good solution to clearly separate the tests and stop any application callbacks is to visit a 'neutral' blank page.
-
TIL an easy way to populate an data array php javascript
Bonus - I just had to do this in PHP as well, so you get TWO languages for the price of one TIL!
-
TIL Bob who hired chinese developers to fix programming
Bob had hired a consulting firm in China, sent the consultants the work assigned to him, and then got out of the way, collecting paychecks the whole time
-
TIL system light mode and dark mode css
Ever notice on mobile devices or on macs, tabs go from light to dark depending on the time?
-
TIL Separating purpose and appearance in CSS css
Appearance is how the variable looks. Purpose is the intent of the variable.
-
TIL Truncating text with Ellipsis css
You know you get a body of text, but you only want a specific amount to be shown?
-
TIL Redefining the environment, not the function itself programming
I think we all can agree that something smells with this code.
-
TIL Deallocating memory in Javascript javascript
Garbage collection is done automatically in JS. But how does it work?
-
TIL the -s in npm install means silent install npm
In other words, including -s (or --silent) in your npm install command means that it will have no output (only a newline)
-
TIL that Windows 10 has code all the way back to Windows 3.x windows
This dev digs real deep to see how far Windows has been re-using UI elements.
-
TIL Getting rid of if/else and switch statements javascript
Getting rid of if/else and switch statements
-
TIL Putting a redundant API key as a backup api
Have a backup API key in your system. If you get a rate limit error, you can switch over to it.
-
TIL Lexical Scoping javascript closure
Lexical scoping describes how a parser resolves variable names when functions are nested.
-
TIL How CSS get added into the DOM css html
Render Tree is CSSOM + DOM Tree with all the correct stylings
-
TIL Starting with Yes lead-dev people
At my previous job, I had the opportunity to work with a really brilliant tech nerd. He was my boss, and he's been in the tech space for over 30+ years, and would frequently remind me of this tip.
-
TIL Some fun dirty coding tricks in video games (2009 edition) hacks gaming
This classic gamasutra article from 2009 about some of the hacks developers did to get their game out of the door.
-
TIL Higher Order functions to reduce loops math loops javascript
Higher Order Functions like Sum, Map, Filter, Reduce
-
TIL Avoiding Off-by-one errors and state using Recusion math loops javascript
Recursion is a function that calls itself.
-
TIL Stateful and stateless math loops javascript
An expression in a programming language can be “stateful” or “stateless”.
-
TIL One-by-one errors math loops javascript codepen
An off-by-one error is when you expect something to be of value N, but in reality it ends up being `N-1` or `N+1`.
-
TIL the problem with using Loops math loops javascript
Loops tend to have some flaws. Instead use Higher Order Functions
-
TIL HTML elements like Blockquote, datalist, details, meter, & progress html codepen mdn
HTML Elements I forget exist. Blockquote, datalist, details, meter, progress
-
TIL column gap for newspaper look css codepen responsive webdev mdn
Use `column-count` and `column-gap` to give it that sweet newspaper look.
-
TIL the definition of various testing types - part 1 testing
This is probably a part 1 of many, since there's so many different test types out there.
-
TIL Sticky navbars with pure CSS css
Google 'Sticky Header', and you'll get a crapton of tutorials. Here's a vanilla CSS way to do it.
-
TIL how to update pi-hole on Win10 raspberrypi ssh
Pi-hole is great. It provides adblocking on a network level.
-
TIL Adding your own custom panel in Devtools devtools
I was always curious how chrome extensions like `React Devtools` or `Vue Devtools` magically pop into the Devtools section.
-
TIL how to get passwords from Filezilla passwords
A while back, I needed to get the saved password of a website from FileZilla.
-
TIL Copy/Paste SVG Icons html svg optimization generator
And by inlining the SVG, you make one less call, and it loads faster. heroicons.dev is awesome
-
TIL Accessible CSS Accordions html css accessibility
For years, I've been looking to find a CSS accordion that is also accessible.
-
TIL CSS Counter counter css
CSS has a method to automagically generate numbers and pop it into the element itself.
-
TIL removing ELSE statements to write clearer code javascript webdev
Programs are meant to be read by humans and only incidentally for computers to execute. Donald Knuth
-
TIL outline-offset accessibility css
Some sites remove :focus. Those sites suck. They should instead do this:
-
TIL injecting links when the user wants to print thew ebpage css
A neat code snippet: If the user prints the page (for some reason), links get injected into the print.
-
TIL browsers explicity prevent sharing of cached third-party resources webdev privacy
The original idea was that you would load resources from a CDN. Doesn't work anymore
-
TIL globalThis javascript es2020
`this` doesn't mean the same things depending on environment. Use globalThis
-
TIL this Responsive Image Generator html optimization
With website optimization, it's better to deliver only the image that the browser size needs. Do that here.
-
TIL Optional Chaining javascript es2020 codepen
The optional chaining `?.` is to see if the value exists
-
TIL planes having to restart to avoid overflow fun
Boeing planes generally have overflow happens after >200 days.
-
TIL how Atari's Pitfall generates over 255 unique rooms gaming
How it was done was by allowing code to generate the room, rather than mapping the room out and saving the data.
-
TIL that PHP has an abandoned Gender Library php lolz
This extension, in short, tries to guess the gender of first names.
-
TIL how fonts draw greyscale fascinating fonts
This may be super esoteric knowledge and could have incredibly limited usecases beyond this post.
-
TIL When to use Serif vs San-serif css fonts
Serifs are recognized for having small decorative lines added as embellishment. San-Serif is basic.
-
TIL roman numerals in list elements html
In documentation, you often find roman numeral listings, and I never bothered to figure out how that was done!
-
TIL the Chocolatey GUI win10
Installing software via the command line is a way of life. Btw this GUI is really nice too!
-
TIL about Mounting/Unmounting without software in Windows 10 win10
I used to download a virtual CD drive to mount isos. Apparently, it's built into Windows 10!
-
TIL Alt text for images that are important accessibility html
Alt text is required if the image is a critical part of the content.
-
TIL Alt Text for everything else accessibility html
alt text for images with captions, that are decorative, part of image sets
-
TIL Adding Alt text to Supporting Images html accessibility
For images not critical to the content but support it, a alt attribute must be present.
-
TIL Creating save file versions and a update path gamedev
Check save version. If less than current version, update the save data.
-
TIL 1999 security preach in Hotmail accounts history
Anyone could read or send email from a Hotmail account
-
TIL Immediately Invoked Function Expression javascript advanced
This is a design pattern where you create a function expression that is immediately executed.
-
TIL Closure as a backpack javascript advanced
The Backpack concept is a mental model to think about how closure saves data behind the scenes.
-
TIL what to do if you're a Win User getting NODE_ENV errors windows npm
Setting NODE_ENV=production before command babel doesn't work on Windows.
-
TIL writing-mode css accessibility codepen caniuse
How to flip text so it's sideways, for international reasons.
-
TIL about the CORS-ANYWHERE project webscraping heroku
I was building a web scrapper for a game using Vue, Axios, and Cheerio.
-
TIL @extend and it's alternatives sass css
I learned about `@extend` as a way to grab the styles from a element.
-
TIL about console.count and console.table debug javascript
Some different ways to show data via your console
-
TIL how the documentation guides Javascript javascript
Essentially, the ECMAScript team makes recommendations. And Javascript engines follow the spec to implement.
-
TIL about adding Styling to scrollbars css webdev codepen scrollbar
You can decorate your scrollbars with CSS
-
TIL Server-side rendering vs Static Generation optimization
Server-side sends a fully rendered page to the client. Client-side, you cannot interact with the site, and instead will need to wait for all of the JS to download, to allow the SPA framework to operate.
-
TIL Triggering Reflow seo html
Have you ever been reading an article online when something suddenly changes on the pag
-
TIL this one-line script to capitalize the first letter of a word javascript
Other langauges have this. JS has to do it manually
-
TIL how to jump to a element within a Vue Component vue
You use the $el selector and a scrollIntoView
-
TIL about the term Jank seo dom
Jank is a term that focuses on how a webpage is performing. It's not about the page load, but how smoothly the page renders.
-
TIL the 4 steps in rendering a webpage html
A typical browser renders a document in 4 steps: style, layout, paint, and compositing.
-
TIL Colorfonts css design
But what if you could define more than one color per glyph? That's ColorFonts!
-
TIL about ESNext javascript
ESNext is a name that always indicates the next version of JavaScript. Spoiler.
-
TIL Switching to SVG for Icon Fonts css icons
Icon fonts on the web were fundamentally flawed from the beginning. With full SVG support, let's use that
-
TIL The Media Engagement Index seo
In 2018, Google Chrome changed the way autoplay works by including the Media Engagement Index (MEI)
-
TIL Scroll Margin for anchor links css html
When you use anchor links, it jumps to the content with the assigned ID. But it sucks.
-
TIL how to scroll to an element in JS javascript
The normal HTML way is with an anchor link. But sometimes, you need to do it with JS.
-
TIL How to connect to your Raspberry pi (home network) raspberrypi linux
Connecting to your Raspberry Pi
-
TIL how Monster Rancher generates monsters gamedev
In Monster Rancher, monsters can be generated by inserting any CD into the game system. How does that work?
-
TIL Categorizing code codetheory dev
I find myself wanting to refactor everything that doesn't move right. I like this post because it doesn't treat all code blocks as equal.
-
TIL that you shouldn't use Placeholders as inputs accessibility ux html
Placeholder texts aren't labels.
-
TIL Bootstrap 5 removing jQuery will reduce about 83kb of loading time frameworks css
Bootstrap 5-alpha1 has been officially launched dropping jQuery as a dependency and also removing browser support for Internet Explorer 10 and 11.
-
TIL How to Summon WordPress in random PHP files wordpress php
How to use WordPress Helper functions outside of WordPress
-
TIL the Capitalize String shortcut js
JavaScript doesn’t have a function that allows you to capitalize a string
-
TIL about using wpdb to insert data into the WordPress Database wordpress
using wpdb to insert data into the WordPress Database
-
TIL thisisunsafe devops
If you are not a developer and you stumbled on this tip... you should understand that this is a BAD IDEA.
-
TIL adding WP_HOME & WP_SITEURL wordpress
You can add WP_HOME and WP_SITEURL to wp-config.php to override your WP database
-
TIL chaining Vue 3 Main.js vue js
Vue's Main.js file looks slightly different. Here is how to modify it.
-
TIL about the bullet ::marker css
When you have a list element, you had to hack the css to change bullet items. Not anymore!
-
TIL about how to quickly add a WP Theme customizer Option wordpress php
You can do a lot of theme customization that auto-loads the page with every setting change. It's a really nice feature.
-
TIL how to get WordPress functions working in VSCode vscode php
Right out of the box, PHP Intelephense Extension for VSCode will give errors for WordPress code. How to fix.
-
TIL of how to generate ASCII folder structures devtools
It's common to explain or discuss a file system structure
-
TIL how to run npm that's inside a child folder npm
Running npm scripts on other package.json files inside child folders
-
TIL how to check if a dom element has a specific class js css
How to destructure the classList into an array so you can use include()
-
TIL As of 2020 -- 88% of the US have 4G or higher mobile speeds stats
So those 3g tests are really targetting a small minority.
-
TIL Waiting for video to load event listeners js
I discovered the Media Events `loadedmetadata, loadeddata, canplay, canplaythrough`
-
TIL about testing your android directly with Chrome Devtools testing mobile
Web developers have a nice Chrome DevTools to do work in. How about Mobile dev
-
TIL as of 2021, 1024x width is 2% of the world screensize
1024x desktop is still a option on Google DevTools.
-
TIL about styling active/focus together html css fe-masters-css-in-depth
Style active and focus at the same time. Some people get to your link or selection by keyboard.
-
TIL how to use CSS to count things html css fe-masters-css-in-depth codepen
Using CSS Counter, counter-reset, and counter-increment.
-
TIL You can look for elements with specific attributes html css fe-masters-css-in-depth
Target elements via CSS with certain attributes
-
TIL reverting back to master after a wild rabbit hole git
Sometimes, you go off in the deep end with your repo and you want everything back to how it was on master.
-
TIL Wordpress guesses URLs wordpress
If you write the URL of a page in a WordPress site incorrectly, WordPress will try to guess what page you were trying to access and “fix” your request so that you get the proper page and not a 404 error.
-
TIL the html lang affects the screen reader voice html accessibility
<html> element's lang attribute tells it which language it is written in.
-
TIL Putting error messages above the field accessibility forms
Putting error messages above the field
-
TIL You can inject JS functions as Chrome bookmarks chrome
You can put JS functions into a bookmark that will fire on the webpage you are on.
-
TIL All the Javascript Sandboxes javascript sandbox
You need help? Use a JS sandbox to make their lives easier.
-
TIL making data prettier ui
Your UI doesn't need to map one-to-one with your data's fields and values.
-
TIL Rando.js javascript npm
Node Version Manager might be the reason everything's broken in your life.
-
TIL Node Version Manager javascript npm
Node Version Manager might be the reason everything's broken in your life.
-
TIL WordPress cache busting wordpress caching
Importing scripts into WordPress causes it to cache. Cache bust them!
-
TIL Adding a repo as a dependency in package.js javascript npm
If they aren't published as a NPM, you can still do this
-
TIL The Boyscouts Rule basics
Always leave the code you're editing a little better than you found it. - Robert C Martin (Clean Code)
-
TIL About various ways to declare WP Options/Settings Page wordpress php
After a lot of research, I found two approaches for writing WP option pages with code.
-
TIL Box-sizing css layout
Setting box-sizing to border-box is a neat trick to avoid any unexpected padding issue. It tells the browser to include any border and padding in the values you specify in that element’s width and height itself. For example, if your element width is 125px, then any padding you add will be included in that width(125px) itself.
-
TIL difference between justify-content vs justify-items css grid layouts stack-overflow
The 'justify-content' property aligns columns within the container. The 'justify-items' property aligns grid items within their tracks (not the entire container)
-
TIL Grid Layouts by Jen Simmons grid layout
I absolutely love how Jen Simmons uses Grid to show what can be done. Two completely different usages of grid
-
TIL applying a filter directly to a background using backdrop-filter caniuse experimental css backgrounds
backdrop-filter applies to everything behind the element, to see the effect you must make the element or its background at least partially transparent.
-
TIL clip-path and shape-outside css image shape
You know how you can shape a picture into a circle, and then wrap text around it? You can do that with two features.
-
TIL How to add a placeholder cursor in an input inputs placeholder css
How to add a placeholder cursor in an input
-
TIL about RxJS Observables javascript
RxJS is a reactive programming library, using Observables which takes in a stream of data and emits multiple bits of data over time. They get 'subscribed' to, and events fire from that.