Recently, CSS has supported "logical" direction based properties for margin, padding, border, etc!
Previous to this, we were able to define properties based on physical directions like left, right, etc. This was a problem when different writing modes come into play, such as Arabic which is written from right to left, or traditional Chinese, Japanese, which are written from top to bottom.
👉 These new properties automatically adjust to the writing mode without the need for media queries.
"block" indicates main axis of writing mode (top to bottom for English)
"inline" indicates the cross axis of the writing mode (left to right for English)
You can combine this to create different properties for margin, padding, border, size and inset
👉 margin-block-end
👉 padding-inline
👉 border-inline-start
👉 inline-size
👉 block-size
✨ This also has the benefit that it provides shorthands like margin-inline which sets both left and right margin
Previous to this, we were able to define properties based on physical directions like left, right, etc. This was a problem when different writing modes come into play, such as Arabic which is written from right to left, or traditional Chinese, Japanese, which are written from top to bottom.
👉 These new properties automatically adjust to the writing mode without the need for media queries.
"block" indicates main axis of writing mode (top to bottom for English)
"inline" indicates the cross axis of the writing mode (left to right for English)
You can combine this to create different properties for margin, padding, border, size and inset
👉 margin-block-end
👉 padding-inline
👉 border-inline-start
👉 inline-size
👉 block-size
✨ This also has the benefit that it provides shorthands like margin-inline which sets both left and right margin
🔥7❤6👍2
🥕 Understanding the Differences Between WebSocket and Socket.IO
Modern web applications rely on real-time data exchange for seamless user experiences. Technologies like WebSocket and Socket.IO allow instant, two-way communication between clients and servers. This guide explores how WebSocket works, its benefits and limitations, and why Socket.IO is a powerful tool for real-time interactions.
Modern web applications rely on real-time data exchange for seamless user experiences. Technologies like WebSocket and Socket.IO allow instant, two-way communication between clients and servers. This guide explores how WebSocket works, its benefits and limitations, and why Socket.IO is a powerful tool for real-time interactions.
❤10👍1
⚡️ How we tamed Node.js event loop lag: a deepdive
At around 11pm local time (10pm UTC) on Thursday June 20, we were alerted to some issues in our production services powering the cloud, as some of our dashboard/API instances started crashing.
We hopped on to our AWS production dashboard and saw that the CPU usage of our instances were really high and growing.
At around 11pm local time (10pm UTC) on Thursday June 20, we were alerted to some issues in our production services powering the cloud, as some of our dashboard/API instances started crashing.
We hopped on to our AWS production dashboard and saw that the CPU usage of our instances were really high and growing.
❤17
🐸 F.I.R.S.T Principles: A Guide to Better Code Testing
Unit testing is a crucial aspect of modern software development, ensuring code reliability and maintainability. To maximize testing efficiency, developers should follow the F.I.R.S.T principles:
- Fast
- Isolated
- Repeatable
- Self-Validating
- Thorough/Timely
By adhering to these principles, teams can create robust test suites that enhance code quality while maintaining development speed. Let’s explore each principle with practical examples in React.
Unit testing is a crucial aspect of modern software development, ensuring code reliability and maintainability. To maximize testing efficiency, developers should follow the F.I.R.S.T principles:
- Fast
- Isolated
- Repeatable
- Self-Validating
- Thorough/Timely
By adhering to these principles, teams can create robust test suites that enhance code quality while maintaining development speed. Let’s explore each principle with practical examples in React.
❤13
🤖 I watch bloggers and noticed that every other one of them advertises zapier – a platform for automation. They say everything is so simple there: connect nodes, get a zap and that's it – craft your own agents. But a subscription costs $20 to make slightly complex zaps.
Then I decided to review open source with similar functionality. And I found automatisch. The service is rolled out with Docker and is ultra-simple. The approach of zapier is one to one, only poorer in functionality.
Then I decided to review open source with similar functionality. And I found automatisch. The service is rolled out with Docker and is ultra-simple. The approach of zapier is one to one, only poorer in functionality.
❤11👍2