DEV Community: Russ Brooks

🗒️ Best Alternatives to Apple Notes 📝

Russ Brooks — Sun, 10 Sep 2023 04:38:33 +0000

I’ve been researching replacement to Apple Notes that:

Export to Markdown (without plugins), including GitHub-flavored.
- Seamless import into dev.to, GitHub Projects & Discussions. I want to drop it in verbatim, and have to fix zero Markdown.
- Would be cool if it synced to these destinations, like TinaCMS does.
Publishes to Web (HTML), but allows 100% Anonymous access.
- Apple Notes requires a login with an Apple account.
- Google Docs also sometimes recipients log in.
- I need to send links to friends and family who don’t have a GH account.
Doesn’t get blocked by restrictive firewalls.
- Google Docs** **sometimes does. I had that problem recently while job hunting. Several employers saying, “Sorry. Can’t open the Google Doc link. Can you send a PDF?”
Doesn’t break images when published
- WebP support
- PNG
Decentralized - Not tied to Evil Corp’s infra.
Muti-Plat for recipients - May have to share notes with folks running Windows / Linux. But being able to publish to the Web solves that problem.
Inexpensive
MacOS native - native ARM binaries. No Java. Mac-native ones are:
- Bear
- Craft
- Goodnotes
- Notability
- OmniFocus
- OneNote - Wha? M$ one is Mac native?
- Taskade
- Things
Standard KB Shortcuts
- Command 1 - H1
- Command 2 - H2
- Command 3 - H3
- Hyperlink - Command K
- etc
Excellent GUI and UX - designed by real designers, not programmers.

Ruled Out

Google Keep - Can only publish via Google Docs. No Markdown.
Google Docs - Np Markdown Export. Sometimes requires a valid Google acc for recipients, and the right permissions set.
MS OneNote - No Publishing to anonymous users. No Markdown export.
MS Loop - $2,000/mo for a feature-crippled mess!? No thanks, M$. I realized it's brand new.
Natabilty - iPen centric.
GoodNotes - iPen centric
Asana - No Markdown. Steep learning curve. Hellish UX. Not an Agile tool. Too costly. Like Jira, can’t assign multiple users to a task.
Evernote - $129/yr
Monday - Not a Notes app. More a PMS centered around Epics & Sprints.
ZenKit
- Pros
  - Low barrier to entry
  - Slick UI
  - Markdown
- Cons
  - The is 90% a PMS.
Standards Notes
- Pros
  - Minimalist
  - Security focused
- Cons
  - No Markdown on Free one. $90 / yr for MD.
  - Not MacOS native
Things
- More Todo List than Productivity Platform
- $50 base price? Yeah, no.
GoodNotes - Mac native! No MD support
Notabiltiy - Mac native! No MD support
OmniFocus - Mac native! No MD support
TaskAde
- Pros
  - Markdown - Import Export
  - AI powered
  - Slick UI
- Cons
  - Not a lot of Export Formats
  - No Syntax Highlighting

Evaluated

ClickUp

Score: 10/10

https://clickup.com/

Pros

Anonymous access to published things.
Project management features are more extensive than Notion.
"ClickUp is the best parts of Notion and Asana".
Markdown export
- Exported MarkDown pastes into GitHub nearly seamlessly. GH blocks external images. You have to reupload them.
- Imports into Dev.to seamlessly.
- Hosts the images at their service. Images don’t break when you paste the Markdown verbatim into Dev.to and other services that don't block External refs. Really cool feature. No other Notes app does this.
Great Syntax Highlighting
- Better than Notion
Whiteboard
Extremely rich Add-on set - You can most likely find any feature in ClickUp that your meets your needs, from Task management to Time management.
Vast Integration Set - “For those functionalities that this feature-loaded software lacks, you will find an Integration for it. ClickUp is preferred by companies of all sizes from any industry and not just a niche audience.”
- “Provides a library of functionalities for any company pertaining to any industry.”
Great for solo workers - “Huge fan base among solo users for managing daily activities and not just teams.”
Views, like Boards, Lists, Gantt, Workloads, Boxes, Tables, Calendars, Activity, and Mind maps.
Custom Tags and Statuses
Custom Permissions
Good support
UI Designed by real Designers - Feels Apple'y. Good use of space, etc.
Thousands of Templates - Better looking than Notion, and literally everything can be templated:
- Checklist
- Subtask
- Task
- List
- Spaces
- Folder

Cons

No PDF import - Apple Notes only exports PDF (or Markdown via a non-Apple app). You have to manually copy and paste all your Notes. It loses your Headings, text formatting (Bold, Italics) and Images, but sustained Lists and Links. I ported 167 notes in about a day and a half.
Default typeface is a little small - I just Zoom it one level with Command +.
Commercial - Could be selling your data. Altho, they claim to not be doing anything sketchy with it.
Dashboard isn't as good as Notion
The very powerful/flexible Templating can be annoying - Templates have to be their own Project. When you want to edit a Template you have to apply the Template to an active project, then change that project, then save that project as new template to override the old template.
Cross-Linking between Tasks and Docs isn't as nice as Notion.

Notion

Score: 9/10

https://www.notion.so/

Pros

Anonymous access to published things!
Markdown export
- Markdown export imports into GitHub fairly seamlessly, other than breaking images.
- Imports into Dev.to fairly seamlessly. Breaks images.
Cross-linking between Tasks and Docs is easier than is in ClickUp.
20% of The Market Uses
DB, Galleries, Tables, Lists, Kahban boards
Can build almost anything with it.
Dashboard better than ClickUp.
Syntax Highlighting
- Simple, 3-color style.
Templates easier to change than ClickUp

Excellent application. I like it second best to ClickUp.

Cons

Markdown export breaks images
- Doesn’t host the images for you like ClickUp.
Lackluster Syntax Highlighting
Horrible light-gray Link color with no underline nor hover. Very hard to tell what's clickable. No setting to change it, nor a plugin.
Weak Collaboration features - "ClickUp is a bit more collaborative than Notion".
Weak Project Mgmnt features - Missing Gantt charts with dependency visualization, Goals, OKRs, time tracking, and estimates.
Slowest app in the Category
Complicated - Notion’s selling point is customizability, however this openness is also a problem. This extensive customizability makes onboarding difficult as it can be overwhelming for novice users. It's hard to establish a consistent workflow team-wide.
- “Feels bloated due to the ton of functionalities that it provides, which is more than what's required, overwhelming and cluttered.”
- “Too many customization options which add to the overwhelming experience that this app radiates”
Cramped GUI designed by Engineers
- “User Interface is intuitive but very complex and so has a steep learning curve that makes onboarding a nightmare”
- “Initial setup is incredibly challenging with high risks of messing up processes due to the complex design”
- “Agile capabilities but lacks the finesse of a dedicated, full-fledged agile tool like Zepel does.”
60+ templates included - Have to rely on Community support for more.
- Only Blocks and Pages (in a Databases) are templatable.
Commercial - Could be selling your data. Altho, they claim to not be doing anything sketchy with it.
No whiteboard

Bear

Score: 9/10

https://bear.app/

Pros

I’m already in Love. This is a developer’s dream. You write in actual Markdown, but you don’t see the Markdown while you type. It renders as beautiful WYSIWYG document. So export to Markdown-based systems is effortless. I think it stores it as Markdown. There is no conversion process.

Seamless import to dev.to and GH. Just fix image links.
- If check “Export Attachments”, It does export the images to a subfolder, and leaves them whatever format they were.**
Syntax Highlighting
- 150 programming languages.
Easy on the eyes.
Themes - 4 included. Pro plan gives you more.
Beautiful UI
Beautiful Typography
- Ligatures!
Mac Native!
WebP support
PNG
Standard KB Shortcuts
- Command 1 - H1
- Command 2 - H2
- Command 3 - H3
- Command K - Hyperlink
- Apple Notes doesn’t support this for Headings. I have to take my hands off the KB, grab the mouse, and click an icon to make Headings.
iCloud Sync - keeps Notes in sync with other computers. Cool.
online reviewer, "Feels like a combination of Evernote and Apple Notes."
Ver 2 coming out soon.

Cons

Images break. Gotta re-attach them upon Publishing.
- Big win for ClickUp. Only one that hosts them at their service.
No Cloud service to publish things to as HTML docs like ClickUp, Notion, and Joplin have.
No Anonymous access to your Public notes.
Win to Notion, Joplin, and ClickUp.

Joplin

Score: 8/10

https://joplinapp.org/

Pros

Public published notes. No login required!
Centered around Markdown - stores its Notes in MD.
GitHub Flavored MD
Excellent Syntax Highlighting. May be the prettiest of the lot.
- The Aritim Dark theme looks very similar to my beloved “Tomorrow Night” in VSC, Terminal and Nova.
Advanced Markdown. Chemical Formulas, Math, Videos, PDFs Diagrams, and Audio.
- Ligatures
Images don’t break when you publish to their Joplin Cloud service.
Flexible Syncing features not tied to EvilCorp: Joplin Cloud, S3, WebDav, NextCloud, DropBox, Local FS, OneDrive
- Really compelling! Using a local WebDav share on my MacMini, and expose it thru the Firewall. Point my MacBook at it.
CLI client
Full access to the CSS it uses, to override UI look. It must be written in Electron.
Plugins
Kahban board

Cons

Not free. Base plan is $1.50 / mo. Acceptable, given those public-Hosting features it supports.
GUI is lackluster but acceptable.
No KB Shortcuts for
- Command 1 - H1
- Command 2 - H2
- Command 3 - H3
- But Command K - Hyperlink is there
Development activity looks slow.
Not Mac native

Craft

Score: 10/10

https://www.craft.do/

Pros

Mac Native
Decent Markdown - Worked in GH and dev.to. But Pro version has better MD.
Public Publishing
Similar to Notion
Ascetically pleasing
Apple ecosystem centric
Many reviews say this is their 2nd favorite to Notion.
Increble UI - best of the lot.
The documents it creates are stunning.
Syntax Highlighting is amazing!
YouTube Embed

Cons

Considering

Mem

https://get.mem.ai/

Pros

AI assistant. Really cool.

Obsidian

https://obsidian.md/

For gardener-style notetakers.

With the right plugins, you deck this thing out like ClickUp.

References

Bypass Any Paywall 💸

Russ Brooks — Sun, 10 Sep 2023 01:16:59 +0000

Use the free 12ft Chrome ext. The huge benefit over other methods: You can send anyone a link to the de-paywalled content. Eg:

https://12ft.io/proxy?q=https://medium.com/change-your-mind/doing-these-three-things-makes-you-look-like-a-jerk-1b7c5b5bedbc

Note the 12ft.io domain it's hosted at. That link will survive forever. Really useful. I can't count the times I sent someone a Medium or NYT link, and they replied, "I can't see that content."

"Shut off JavaScript" is a big ask for the average enduser, and Incognito mode is too. Now your links will work the first time you send to them to luddite friends and family members.

👹🔥 How to Escape JS Framework Hell (Including React) 🔥👹

Russ Brooks — Sat, 02 Sep 2023 02:59:25 +0000

This Why we should ditch React talk is must-watch stuff. Chris Hawkes, is a Senior Software Engineer with over 15 years of experience working for Fortune 500 companies. He has been coding on React for 5 years. He has coded on Angular, Vue.js, and all the smaller ones (jQuery). It’s a interesting chronology of JavaScript’s history.

Highlights

I was so into this, I transcribed it. These are mostly his words, with mine mixed in.

Framework Hell - “All the frameworks & libraries try to accomplish the same thing, from jQuery on.”
- “Global Scope problems”
- “Toe-stepping from CSS rules bleeding into other elements. So we stuck !importants everywhere, which is an anti-pattern. Now everything is important and you’re back to the first problem again.”
- “DOM updates from JS sometimes bleed into other elements you didn’t expect.”
- “The problem compounded further when 6 different JS libraries are all doing DOM updates simultaneously. We had little control over which one ‘won’.”
- My Input: All your code now coupled to that Framework or library’s code.
Web Components - “Solves the Global Scope (bleed) problem.” Solves the Element-idempotency problems.
- Virtual DOM
  - “JavaScript-based, in-RAM DOM layer in front of actual DOM. Queues updates until you call .render(). Performance gains. Also the Virtual DOM is smart about preventing no-op updates. It’s provides Idempotency. It won’t update elements that didn’t need to happen because the Element was already as you specified.”
  - “React & Vue.js”
  - My Input: Hefty. Lots of code, transpilers, new tools, new workflows. Sharing state between siblings is tricky, etc.
- Shadow DOM
  - “Native in browsers. The browser manufactures solved these issues natively. The ShadowDOM has existed for years, but they are just exposing it to Devs so Devs have a way to do this “Component Pattern” natively.”
  - “No longer need a JS lib like React to do your Virtual DOM.”
  - Browser-Native Web Components
  - My Input: Uses real DOM manipulation. There will be time before all browser manufacturers agree on specs an implement. Currently all Major ones support except legacy Edge. Latest Edge that is a Chrome instance does support it.
“React was very successful because of Angular’s failure.”
Angular - Created by Google.
- “Angular reacted to what React was doing and decided to rewrite their entirely library. Version 2.0 scrapped everything from 1.0. It wasn’t backward-compatible. They decided to use something new and young at the time, TypeScript. Devs lost their minds. They had to completely rewrite their libraries, completely relearn Angular, etc.”
JSX / TSX - Uses JS to write HTML. Has way to embed CSS using inline styling.
- “This was a big problem for a lot of devs. The Golden Rule was to always separate your JS from HTML and CSS.“
- “All this learning had to be done. Now we have to use all these tools to transpire everything: WebPack, Babel, etc.”
React - “Great encapsulation. No more bleeding DOM elements. Widgets are easily reusable in other systems.”
- My Input: Communicating events across sibling Elements is tricky. You have to bubble it up to a Root-level State, then Event it out to the other components using Properties.
- My Input: Too complex. You don’t know which feature to use for which use case.
- My Input: Not learnable thru experimentation.
  - You have to take a 100-hour Udemy course because it’s a:
  - Proprietary framework with a very creative implementation.
  - Svelte to me minutes to learn at my last job because it’s a conventional implementation. So did CoffeeScript. Producetive in days
- My Input: Not opinionated. Project structure gets very disorganized quickly, each dev doing radically different things in different parts of the codebase. You often see 3 or 4 different implementations in 1 repo. There is nothing enforcing the implementation of the dev who first rolled it out.
Flux Architecture “solved” that
- “Facebook’s approach”
- “Nightmare: The architecture sucked. And it RAELLY did. I really did not like that experience.” Many developer threads out there about this problem.
Redux - Redux promised to be a “much easier to reason about State than Flux”.
- “One centralized State Store. How did it achieve this?”
- “Synchronously.” Huge problem
- Problem: It breaks down if you tried to do anything with Promises. If you had an AJAX that used Promises, and you needed to update your State, you couldn’t do that. Even to this day, Redux doesn’t do that. To solve that, they brought out:
- ReduxFunc library. Workaround / hack. There’s also one called “ReduxSaga”, and “all this other crap”. His words.
“Short-sighted React architecture gave way to all these other hacky tools.”
Devs bitched: “This is too much work for all these different components to work with each other. It’s too much code to write these Class-based Components.”
“React reacted to that by creating Functional Components.”
- “Everyone has to pump their breaks, figure out Functional Components, rethink how they’re doing Components, and rewrite everything to Functional.”
- “You don’t use Functional Components, you’re an asshole.”
- Functional were deigned to live along side (not replace) Class based, and be used in tandem depending on the use case. If you need State, use Class based. If you don’t, use Functional.
  - Since Functional components are not objects, you must use React hooks to manage State and lifecycle events. Hooks were not introduced into React until version 16.8, but they have effectively made Class components redundant.
  - More cost porting the whole repo to Functional.
Svelte
- “Instead of React’s library that you download into the browser, that has to do all sorts of internal manipulation and handling and DOM DIFFing. All this logic to determine what’s been updated so it minimizes re-updating.”
- “Svelte comes along and says ‘We’re going to do all that work in advance. We’re going to compile all that into JS in advance.’
- “Smaller footprint. Easier on Client browser.”
- React reacts to Svelte
React Hooks
- “Write Func Components in a completely new way.”
- “Now Devs had to completely rethink and relearn the way they use React’s lifecycle.”
- “You don’t use React Hooks, you’re an asshole.”
- “More rewriting, etc.”
“The whole point, behind this video, is that maybe we should ditch React because of its shortsighted architecture.”
“Maybe we should stop being these herded animals following each other from one side of the field to the other. We keep going around in circles and getting nowhere.”
“Ember, Glimmer, etc. All the same thing.”
“We keep having to rewrite our architectures.“
“Native HTML and CSS and JavaScript essentially do what most of this stuff does.”
“Tons of companies out there using Redux, and they have no idea why.”
“And we wonder why we have to pay Developers $140k a year.”
“When we first started using React Components, they weren’t encapsulated. So we had to start using all these CSS libs that styled the Component specific to that style. Nothing’s worse than a bunch of inline styles, whether it’s in the Component or not. Granted, with React you can centralize the CSS. Even if we have tools that allows us to write CSS outside of the component, there’s all kinds of new problems to solve. When we were trying to solve the problems with the ShadowDOM 10 years ago.“
Commenter on that YT video: “Facebook never intended for React to be used as an application framework. They created React to be the "V" in their "MVC" variant called "Flux." For some reason, the developer community started using React as a stand-alone framework, which introduced the problem of defining models inside views, then using all kinds of spaghetti code to make those models accessible to other view (props drilling, context wrapper hell, etc..). Groupthink is truly fascinating.”
Another commenter, Dan Levin: “Svelte is the only one so far that got it right. I started learning React recently for a job and I was pretty shocked from the amount of unintuitive convoluted code just to implement a glorified global variable. This problem that React has been trying to fix for a long time doesn't even exists in Svelte, Can you imagine? a framework that implement a global variable that whenever you change it all components update accordingly.”
Framework Hell
THE SOLUTION TO THIS MESS! Browser-native, or extremely light components.

Solution: Lit, Slim, or Vanilla-JS Components

Lit - Formerly:
- Polymer - Polymer was created by Google, and became Lit.
- “When Polymer first came out, it was a ‘utter piece of crap pre-1.0’. It was so large, you had to use all these Polyfills to support it. It’s much better now.”
- Best thing about this project: It’s goal is to not exists one day. Eventually go away, and be replaced by the native-browser Shadow DOM.
- It’s a small Polyfill for the older browsers that don’t have a full Shadow DOM yet, and to abstract away differing implementations from you.
- It’s analogous to the old HTML5 “shim” library. Its purpose was to go away once the browsers caught up.

Also similar to how we can write ES6 today, and Babel and WebPack abstract that away from us by transpiling to legacy JS. When ES6 browser support is wide enough, you can lose Babel, Vite, etc.

Conclusions

There are better alternatives to React.
We can use native-browser Web Components now!
Never have to rewrite our components in the future.
When they do become browser-native, think how light (in RAM) and fast they’ll be. No heaps of abstraction between your code and the Component.

Lightweight 🪶 JS Frameworks Are 😎

Lit libraries are awesome - formerly Polymer
- Not immature. Polymer has been in development since 2013.
- Google's "Material Design" libs for widgets. I used them in my React project and liked them.
- Polymer is used by a number of aGoogle services and websites, including the redesigned YouTube, YouTube Gaming, the redesigned Google Earth, Google I/O websites, Google Play Music, redesign of Google Sites and Allo for web.
- Some non-Google cos using it: Netflix, Electronics Arts, Comcast, Nuxeo, ING, Coca-Cola, McDonald's, BBVA, IBM and General Electric. Not that “because Compony X use it” is any reason to adopt. That’s just me researching its legitimacy myself.
Preact - My personal site is built on it.
Vanilla
Slim
Mithril

🧑🏽‍💻 Set Up MacOS for Development Productivity

Russ Brooks — Sun, 27 Aug 2023 16:24:52 +0000

https://www.youtube.com/watch?v=BMtG52U3cEY - Excellent Python tips on his channel. Now that I'm a Python developer again, I'm revisiting my toolset to make sure it's "New Hotness". The dev tool stack he recommends is excellent:

Package Mgr

Brew & Git

Obviously

Infrastructure as Code (IaC)

Pulimi

Universal IaC for AWS.

https://www.pulumi.com/

Dependency Management

Poetry

Python Dependency Management Made Easy

https://python-poetry.org/ - Poetry had me at TOML a .lock file, and behaving like Bundler. No having to manually manage Virtual Envs.

Productivity Platforms

Notion

Notion is excellent. I have an article coming on the Pros and Cons of each Productivity Platform.

https://www.notion.so/

ClickUp

https://clickup.com/

ClickUp actual has a higher rating than Notion in this Forbes article. It also publishes your notes to the Web in MD format without breaking images. It uses their hosting service to store them, then your Markdown has absolute URLs in it to those images. Really innovative. I believe they are the only one that has this feature.

Things

Some overlap with Notion and ClickUp, and Things has some automation tools with it.

https://culturedcode.com/things/

Password Manager

BitWarden

https://bitwarden.com/

👆 Also has Browser Plugin

Clipboard

Maccy

Better Clipboard for Mac

https://maccy.app/

$ brew install maccy

Window Management

Rectangle

https://rectangleapp.com/

$ brew install rectangle

Time Logging

toggl Track

https://toggl.com/

Terminal

iTerm2

https://iterm2.com/

Oh My Zsh

Shell Swiss Army Knife

I vouch for this. Been a fan for years.

https://ohmyz.sh/

Next-Gen Command Line

Fig

I eval'ed Fig at my last job. It was excellent. I turned my team onto it.

https://fig.io/

Store Scripts in Cloud
Awesome Autocomplete
DotFile Presets
Plug-in Store
Themes
Written in Rust 🦀

DevToys

Developer Swiss Army Knife

https://devtoys.app/

It’s Microsoft PowerToys, but for Devs.

Convertors like JSON to YML, character formats, Number bases, etc.
Genertors for Hashes, UUIDs, etc.
URL convertors.
"Loren Ipsum" generator
Mac Port!

$ brew instal devtoys

Would be useful as an Extension for VSCode.

IDEs

Nova

Formerly Coda. Panic males great Mac software. I [re]adopted this full-time lately. I did use Coda for a bit prior to my 5 years of VSC use.

https://nova.app/

MacOS Native
- Mac KB shortcuts are all there. VSC is missing a couple.
Beautiful UI
Rich Extension community.
Lightweight
- Native binaries, not RAM-intensive Chrome/Electron instances.
Fast
Ligatures
Yes, commercial, but cheap. That's a positive for some. You know it will be supported infinitely.

VSCode

Extensions

Fig - I can't find a "Fig" extension in Marketplace, but I did find:
FigStack - He doesn’t mention it, but it looks 😎 too.
Python
GitHub Copilot
- Autocomplete and snippets
Markdown Extended
Markdown PDF
Markdown Preview Mermaid - Flowchart Support in Markdown. 😎
vscode-pdf - Display PDFs in VSC.

DB Admin Tools

TablePlus

https://tableplus.com/

I couldn't be a bigger fan of this DB client.

Fast, Mac native. Standard KB shortcuts all there.
Supports 16 DB brands, including BigQuery, MySQL, SQL Server, MongoDB, Vertica, Oracle, PostgreSQL, Snowflake, Microsoft CockroachDB, and Redis.

Finder Settings

Turn on Pathbar and Status Bar - from the "View" menu
Customize the Toolbar
- Add the "New Folder" icon
Advanced Settings
- Turn on "Search Current Folder". By default, the Mac searches the whole drive.

Deno on Fresh 1.4 Adds FTL Drives 🚀

Russ Brooks — Wed, 23 Aug 2023 02:34:23 +0000

I hereby confirm Fresh 1.4's perf-improvements are legit!

Fresh 1.1

❯ wrk -t12 -c400 -d10s http://www.russbrooks.com
Running 10s test @ http://www.russbrooks.com
  12 threads and 400 connections
Requests/sec:    121.80 👈

Fresh 1.4.2

❯ wrk -t8 -c500 -d10s http://www.russbrooks.com
Running 10s test @ http://www.russbrooks.com
  8 threads and 500 connections
  Thread Stats   Avg      Stdev     Max   +/- Stdev
    Latency    27.93ms   38.66ms 514.91ms   93.96%
    Req/Sec     1.34k     0.98k    3.60k    65.40%
  105725 requests in 10.07s, 19.96MB read
  Socket errors: connect 253, read 0, write 0, timeout 0
Requests/sec:  10495.36 👈 🚀 🚀 🚀 🚀

That jives with the numbers here, where Fresh placed second-fastest framework.

Lighthouse Score

Equally incredible!

Hosted on a free account at Deno Deploy. Imagine what the numbers would be on Enterprise-class infra. This means we finally have Fire-and-Forget websites, because a single Node is able to handle a 10X more traffic than your Ruby/Node/Python ones. No more scrambling to scale every 8 weeks, after your team launches 1.0, having to answer pages at 3 AM because your Scripting-Language just collapsed at 500 R/s, then again at 1,000 2 mo later, then 1,500 2 mos later, then 2,000, then 2,500, etc.

Our Rust boxes never trigger PagerDuty.

-- Steve Klabnik

I'm really pleased with the whole Deno experience, from toolset, to perf, to pkg mgmnt, to sensible defaults, to the TypeScript Std Lib that's bundled, to the Edge-First global deployment you get free.

Leave Implementation Details to Implementation Time

Russ Brooks — Wed, 21 Jun 2023 23:57:45 +0000

An Observation at Planning Meetings

Assuming it's a mix of Engineers and non-Engineers (Product, PMs, Design, etc): When Engineers get rabbit holey with implementation details trying to come to consensus on the specs, the non-techies in the room:

Eyes glaze over.
Get quiet. There's obviously not much they can contribute. They're non-engineers.

👆This is time they could have spent doing their actual work. Tech talk is tedious to non-technicals. Now we're just wasting their time.

Then the Engineers rush to find those spots in code, live during the meeting, and try to quickly come to consensus. This 2 minutes is almost never enough time to arrive at such important details.

Significant Events Between Planning and Coding

A number of important things happen between Planning meetings and us writing the code, even in a couple days:

More public information is available now. The Internet is growing at an astronomical rate.
- Posts
- Comments
- Documentation
- Newer versions of libraries released
- Some libraries may have been deprecated since
- Best practices on how to do it right
- Posts on pitfalls
- Better alternative libraries
- Better alternative way of doing it
More Internal information now exists in your Corporate Knoweledgebase.
More lore has been exchanged between brains - Verbal, Slack, etc.

Most Engineers I know do a quick Googling to validate their assumptions, before beginning any fairly significant changeset. During that first hour of coding, you almost always find things that could never possibly have been discovered at Planning Meetings.

I can't count the times I've started coding a ticket and go, "Oh, there's some new library or pattern that does that way better."

Now those Implementation Details on the ticket are invalid.

I've heard some devs defend this by saying, "The Planning Meeting is implementation time."

Let's look at the definition.

Implementation is the execution or practice of a plan.

Otherwise known as "doing the work" (writing the code).

Framework Performance Results: Rust, Go, Node, Deno, vs Ruby

Russ Brooks — Wed, 16 Mar 2022 00:54:45 +0000

We have entered the age of Fire-and-Forget websites. Imagine a single process able to handle 100,000 RPS. You would never have to scale that application horizontally. No PagerDuty at 3 AM because your infra is collapsing under its own weight.

My SpreadSheet:

https://docs.google.com/spreadsheets/d/1WiOBYR1FGnWh65IA-h_E0kcchS1y5J0CEFz5wHBHqBU/edit?usp=sharing

Code Splitting With Dynamic Imports

Russ Brooks — Fri, 03 Sep 2021 23:44:04 +0000

Benefits

Better UX
- Breaks your JavaScript bundle into multiple modules that intelligently load only when a user uses that functionality.
- Loading and wait times are improved application-wide.
Hosting-Costs - Lowers overall "Bytes Transferred" every month.

How To

Dynamic Imports is already enabled by default in WebPack. All you need to do is make a small change to your "import" lines, and wrap the component in React's <Suspense> component. Eg:

import React, { Suspense } from 'react';

const SubComponent = React.lazy(() => mport('./SubComponent'));

function MyComponent() {
  return (
    <div>
      <Suspense fallback={<div>Loading...</div>}>
        <SubComponent />
      </Suspense>
    </div>
  );
}

I had to comment out this line of our tsconfig.json or I got an transpile error. This makes it default back to "CommonJS", which is an older JS standard, but that had no effect on our compiles. Our large React/TS application compiled fine. This is an Output setting; not an Input setting. It only changes the format of JS files that are output to the browser.

{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "jsx": "react",
    "lib": ["es6", "dom"],
    // "module": "es6",
    "moduleResolution": "node",
    "sourceMap": true,
    "strictNullChecks": true,
    "target": "es5",
    "types": ["jest", "node", "react", "@testing-library/jest-dom"],
    "esModuleInterop": true
  },
  ...
}

You can see in CDT, this caused two additional "chunk.js" files to be created, and these files only loaded when that user clicked on that functionality - opened a modal in this case.

Have you team continue to adopt this import syntax, and gradually your JS code will be split into smartly loading modules.

Whisk Away Wi-Fi Woes: Mesh Network

Russ Brooks — Sat, 09 Jan 2021 06:15:05 +0000

Problems

I live in a 3-story townhouse. I have had a single Apple AirPort Extreme on the first floor for 6 years. The device has been fantastic, but there are naturally some issues due to the physics of electromagnetic waves traveling through solid objects, and having a 3-story home:

Very weak signal on 3rd floor. Unable to stream HD content without “wait” cursors appearing constantly. Because of this, I haven’t been able to put Apple TV’s in the bedrooms, and I have had Ethernet running to my main desktop machines for 15 years. (My house is Ethernet wired.)
Weak spots on 2nd floor.
- Couch with a MacBook Air: Transfer Rate 150 to 200 Mb/s most of the time, compared to 800 Mb/s sitting closer to the router.
- Deck: Also spotty coverage: dropouts, buffering, etc.
Gaming consoles (PS4 Pro and Xbox) sometimes having trouble connecting to the Cloud. They throw occasional “can’t connect” errors.

To solve this, some might install “repeaters” or extra routers. There are a few problems with that. You now have 3 separate wireless networks that your devices must manage. Very few devices seamlessly hop from Access Point (AP) to Access Point. Sometimes you have to manually switch your device to the other network, every time you walk to the underserved location in your home. You are also now burning undue bandwidth between your router and those endpoints - bandwidth that should be going to your personal devices. In most cases, those Access Points can only communicate directly with the Router, not with each other. (That’s an inefficient routing path.) You spent $900 to make all this happen, and you needed to hire your “I.T. buddy” to install and configure it, and you bribed him with old Comic Books (I mean “Graphic Novels”).

Solutions

Wi-Fi Mesh Network

If you enlisted Geek Squad 3 years ago to “make my WiFi better”, odds are they put in some repeaters or more traditional Access Points. With a network like that, each AP is a small, independent, unintelligent “bubble” with a highly local signal - no awareness of the other bubbles. With a Mesh Network, it’s a single, giant Wi-Fi bubble that wraps your entire home.

With a Mesh Network, each device is interconnected. Nodes can pass thru data to other Nodes. Signal strength is not lost, because it makes small jumps from device to device, rather than one large jump to the Router. Because of their decentralized nature, Mesh Networks scale endlessly, by adding more cheap $99 nodes, and maintain signal strength and reliability.

LinkSys Velop

I got this one:

https://www.linksys.com/us/velop/

It’s one of two that they sell in Apple Stores, and I’ve had plenty of LinkSys gear, over the years, and trust the brand. I got the Mesh Router and 2 nodes (3-band), one for each floor.

The install could not have been easier:

Put router in the spot where my AirPort Extreme was, and connected it to the same FiOS ONT, via the same Ethernet cable.
LinkSys’s mobile app guided me through the install.
Plugged in 2 more nodes, and the app detected them and added them to the Mesh.

I connected various devices to the network and dog-fooded it for a few days.

Results

Wired reliability in a wireless network. No drop-outs, buffering, flakiness, etc.
Dead spots: gone.
Weak areas: gone.
Transmission rates consistently high.

The MacBook Air in this screenshot used to get 250 to 300 Mb/s while sitting on the 2nd-floor couch. Machines upstairs would get 100 to 200 Mb/s, and have buffering problems with video. Now, all 3 of these areas connects at 850 Mb/s, and suffer zero connectivity issues.

External Monitor for MacOS: Avoiding the Blurry Text Issues

Russ Brooks — Mon, 04 Jan 2021 05:53:23 +0000

“Blurry Text” Problem

Reports of the issue:

This blog post has excellent advice on solving the clarity issues when you run a Retina-level external monitor - and you run it at lower-than-native resolutions, which is 90% of the time. Hardly anyone runs their Hi-DPI monitors in Native res. The type is too small. When you lower MacOS’s resolution down to anything below Native, now you’ve got blurred text. This is due to fractional-math problems because the external monitor is 163 PPI and your MacBook Pro is 221.

The most important spec to pay attention to on these monitors is Pixels Per Inch (PPI).

Blurry Text Solution

Buy a monitor with a PPI that matches your Retina MacBook or older MacBooks, but nothing in between. (The older ones were about half, at 128 PPI.)

MacBook Pro: 221 PPI
Old MacBooks and Airs: 128 PPI

Get a monitor that’s either 221 or 128 PPI (or as close as you can reasonably) - give or take 10 PPI.

MacOS is has two sets of UI widgets. It sends the Hi-Res ones to 4K+ displays, and the low-Res ones to anything under 4K. If you’re running one of these PPI’s in between 128 and 221, the OS is going to have to scale things in odd ways.

Important: MacOS only sends Retina assets to 4K or greater monitors. The PPI doesn’t matter. I’ve seen some confusion about this online. Folks buying a Hi-PPI monitor, but one that’s only 3K, and they’re wondering why it doesn’t have Retina assets. MacOS can only “see” the resolution (Pixel count) of the display. It can’t see its “PPI” specs.

Monitor Specs

PPI

Some PPI specs for comparison.

Apple Hardware

2012 MacBook Air - 128 PPI
2020 MBP - 226 PPI
Apple’s $5,000 Pro Display - 218 PPI

2K Monitors

These will be sent non-Retina assets by MacOS. Note the PPI roughly matches old MacBooks and MBAs.

1080p - 91 PPI in a 24” mon 👍 - Good for Mac
1080p - 81 PPI in a 27” mon 👍 - Good for Mac
2560x1440 (Quad HD) - 108 PPI in a 27” mon 👍 - Good for Mac
HP 27er display - 82 PPI 👍 - Good for Mac

4K Monitors

3,840 x 2,160 - 163 PPI in a 27” 👎 - Bad for Mac - PPI is at this dangerous midpoint between MacBooks and MBP.
3,840 x 2,160 - 138 PPI in a 32” 👍 - Good for Mac - PPI roughly matches non-Retina Apple screens (128).

Panel Types

For office and creative work, go with IPS. For gaming, go with TN:

TN - Most affordable. Low image quality but hi-refresh.
IPS - Best overall quality. Higher input lag. For Pros doing graphics work.
VA - Better color and contrast than TN. Not as much as IPS.
OLED - Absolutely killer. Baller expensive.

Adaptive Sync is a variable-refresh technology. GSync is a brand name for one.