]> git.taranathan.com Git - blog.git/commitdiff
pipes
authormoo <moogoesmeow123@gmail.com>
Tue, 23 Jun 2026 10:16:32 +0000 (03:16 -0700)
committermoo <moogoesmeow123@gmail.com>
Tue, 23 Jun 2026 10:16:32 +0000 (03:16 -0700)
content/miniblog/pipes.md [new file with mode: 0644]
public/miniblog/index.html
public/miniblog/pipes/index.html [new file with mode: 0644]
public/sitemap.xml
sass/styles.css [new file with mode: 0644]

diff --git a/content/miniblog/pipes.md b/content/miniblog/pipes.md
new file mode 100644 (file)
index 0000000..bad02ac
--- /dev/null
@@ -0,0 +1,44 @@
++++
+title = "pipes"
+date = 2026-06-22
++++
+
+Huh. I was just thinking about how cool a pipe operator would be in rust, and about method-chaining when I realized that they are both kind of the same thing! For example, look at these rust and gleam (a language with a very similar syntax):
+
+```rust
+//rust
+let result: Result<i32> = fallible_operation();
+let output = result
+  .map(add_one)
+  .map(add_one)
+  .map(add_one)
+  .unwrap_or(0);
+```
+
+<br>
+
+```gleam
+//gleam
+let result: Result(Int) = fallible_operation()
+let output = result
+  |> result.map(add_one)
+  |> result.map(add_one)
+  |> result.map(add_one)
+  |> result.unwrap(0)
+```
+
+When they are formatted this way, don't they look *pretttty* similar? That's because, they are, by definition, the exact same thing. If you look into the function signatures behind any `impl` method/function in rust, they all start with an `&self` or some variation because the dot notation is actually just syntax sugar. If I wanted to write out the rust example the long way, I could've done it like this:
+
+```rust
+// the type of std::result::unwrap_or is fn(self, F) -> Result<U, E>,
+// but in dot notation the first argument is omitted, like in a pipe operator
+
+let result: Result<i32> = fallible_operation();
+let output = std::result::Result::unwrap_or(
+  std::result::Result::map(
+  std::result::Result::map(
+  std::result::Result::map(&result, add_one), add_one), add_one),
+  0);
+```
+
+And the pipe operator in so many functional languages also serves the same purpose: as syntax sugar. Anyways, I just found this kind of neat, and my guess as to a little bit about why there isn't a pipe operator in rust yet, despite taking so much heavy influence from functional languages like OCaml. 
index 00d2c590ecc1863208b9ad3c0e1aaf991058ed02..98e70a57f3b7821e083e6ac02cbdf27997dd02e7 100644 (file)
   <h2 class="section-title">Miniblog&#x2F;journal posts</h2>
   <ul class="post-list">
     
+      <li class="post-list-item">
+        <a href="https://taranathan.com/miniblog/pipes/">pipes</a>
+      <p class="subtitle""> — 2026-06-22</p>
+      
+    </li>
+  
       <li class="post-list-item">
         <a href="https://taranathan.com/miniblog/gitweb/">gitweb!</a>
       <p class="subtitle""> — 2026-06-01</p>
diff --git a/public/miniblog/pipes/index.html b/public/miniblog/pipes/index.html
new file mode 100644 (file)
index 0000000..27fe4eb
--- /dev/null
@@ -0,0 +1,94 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="utf-8">
+  <title>pipes</title>
+  <link rel="icon" type="image/x-icon" href="https://taranathan.com/favicon.ico">
+  <link rel="stylesheet" href="https://taranathan.com/styles.css">
+</head>
+
+<body>
+  <div class="container">
+    <div class="kaomoji-sidebar kaomoji-left">
+      <div class="scroll-text" id="kaomoji-left"></div>
+    </div>
+
+    <main class="content">
+      <header class="header">
+        <h1 href="/">My Blog</h1>
+        <nav class="nav">
+          <a href="/">Home</a>
+          <a href="/blog">Blog</a>
+          <a href="/miniblog">Miniblog</a>
+          <a href="/boo" target="_blank">Fun</a>
+        </nav>
+      </header>
+
+      <section class="content-body">
+        
+  <article class="post miniblog-post">
+    <h1 class="title">pipes</h1>
+    <p class="subtitle"><strong>2026-06-22</strong></p>
+    <div class="post-content"><p>Huh. I was just thinking about how cool a pipe operator would be in rust, and about method-chaining when I realized that they are both kind of the same thing! For example, look at these rust and gleam (a language with a very similar syntax):</p>
+<pre class="giallo" style="color: #CDD6F4; background-color: #1E1E2E;"><code data-lang="rust"><span class="giallo-l"><span style="color: #9399B2;font-style: italic;">//rust</span></span>
+<span class="giallo-l"><span style="color: #CBA6F7;">let</span><span> result</span><span style="color: #94E2D5;">:</span><span style="color: #F9E2AF;font-style: italic;"> Result</span><span style="color: #89DCEB;">&lt;</span><span style="color: #CBA6F7;">i32</span><span style="color: #89DCEB;">&gt;</span><span style="color: #94E2D5;"> =</span><span style="color: #89B4FA;font-style: italic;"> fallible_operation</span><span style="color: #9399B2;">();</span></span>
+<span class="giallo-l"><span style="color: #CBA6F7;">let</span><span> output</span><span style="color: #94E2D5;"> =</span><span> result</span></span>
+<span class="giallo-l"><span style="color: #94E2D5;">  .</span><span style="color: #89B4FA;font-style: italic;">map</span><span style="color: #9399B2;">(</span><span>add_one</span><span style="color: #9399B2;">)</span></span>
+<span class="giallo-l"><span style="color: #94E2D5;">  .</span><span style="color: #89B4FA;font-style: italic;">map</span><span style="color: #9399B2;">(</span><span>add_one</span><span style="color: #9399B2;">)</span></span>
+<span class="giallo-l"><span style="color: #94E2D5;">  .</span><span style="color: #89B4FA;font-style: italic;">map</span><span style="color: #9399B2;">(</span><span>add_one</span><span style="color: #9399B2;">)</span></span>
+<span class="giallo-l"><span style="color: #94E2D5;">  .</span><span style="color: #89B4FA;font-style: italic;">unwrap_or</span><span style="color: #9399B2;">(</span><span style="color: #FAB387;">0</span><span style="color: #9399B2;">);</span></span></code></pre><br>
+<pre class="giallo" style="color: #CDD6F4; background-color: #1E1E2E;"><code data-lang="gleam"><span class="giallo-l"><span style="color: #9399B2;font-style: italic;">//gleam</span></span>
+<span class="giallo-l"><span style="color: #CBA6F7;">let</span><span style="color: #EBA0AC;font-style: italic;"> result: </span><span style="color: #F9E2AF;font-style: italic;">Result</span><span>(</span><span style="color: #F9E2AF;font-style: italic;">Int</span><span>) </span><span style="color: #94E2D5;">=</span><span style="color: #89B4FA;font-style: italic;"> fallible_operation</span><span>()</span></span>
+<span class="giallo-l"><span style="color: #CBA6F7;">let</span><span> output </span><span style="color: #94E2D5;">=</span><span> result</span></span>
+<span class="giallo-l"><span style="color: #94E2D5;">  |&gt;</span><span> result.</span><span style="color: #89B4FA;font-style: italic;">map</span><span>(add_one)</span></span>
+<span class="giallo-l"><span style="color: #94E2D5;">  |&gt;</span><span> result.</span><span style="color: #89B4FA;font-style: italic;">map</span><span>(add_one)</span></span>
+<span class="giallo-l"><span style="color: #94E2D5;">  |&gt;</span><span> result.</span><span style="color: #89B4FA;font-style: italic;">map</span><span>(add_one)</span></span>
+<span class="giallo-l"><span style="color: #94E2D5;">  |&gt;</span><span> result.</span><span style="color: #89B4FA;font-style: italic;">unwrap</span><span>(</span><span style="color: #FAB387;">0</span><span>)</span></span></code></pre>
+<p>When they are formatted this way, don’t they look <em>pretttty</em> similar? That’s because, they are, by definition, the exact same thing. If you look into the function signatures behind any <code>impl</code> method/function in rust, they all start with an <code>&amp;self</code> or some variation because the dot notation is actually just syntax sugar. If I wanted to write out the rust example the long way, I could’ve done it like this:</p>
+<pre class="giallo" style="color: #CDD6F4; background-color: #1E1E2E;"><code data-lang="rust"><span class="giallo-l"><span style="color: #9399B2;font-style: italic;">// the type of std::result::unwrap_or is fn(self, F) -&gt; Result&lt;U, E&gt;,</span></span>
+<span class="giallo-l"><span style="color: #9399B2;font-style: italic;">// but in dot notation the first argument is omitted, like in a pipe operator</span></span>
+<span class="giallo-l"></span>
+<span class="giallo-l"><span style="color: #CBA6F7;">let</span><span> result</span><span style="color: #94E2D5;">:</span><span style="color: #F9E2AF;font-style: italic;"> Result</span><span style="color: #89DCEB;">&lt;</span><span style="color: #CBA6F7;">i32</span><span style="color: #89DCEB;">&gt;</span><span style="color: #94E2D5;"> =</span><span style="color: #89B4FA;font-style: italic;"> fallible_operation</span><span style="color: #9399B2;">();</span></span>
+<span class="giallo-l"><span style="color: #CBA6F7;">let</span><span> output</span><span style="color: #94E2D5;"> =</span><span style="color: #F9E2AF;"> std</span><span style="color: #94E2D5;">::</span><span style="color: #F9E2AF;">result</span><span style="color: #94E2D5;">::</span><span style="color: #F9E2AF;font-style: italic;">Result</span><span style="color: #94E2D5;">::</span><span style="color: #89B4FA;font-style: italic;">unwrap_or</span><span style="color: #9399B2;">(</span></span>
+<span class="giallo-l"><span style="color: #F9E2AF;">  std</span><span style="color: #94E2D5;">::</span><span style="color: #F9E2AF;">result</span><span style="color: #94E2D5;">::</span><span style="color: #F9E2AF;">Result</span><span style="color: #94E2D5;">::</span><span style="color: #89B4FA;font-style: italic;">map</span><span style="color: #9399B2;">(</span></span>
+<span class="giallo-l"><span style="color: #F9E2AF;">  std</span><span style="color: #94E2D5;">::</span><span style="color: #F9E2AF;">result</span><span style="color: #94E2D5;">::</span><span style="color: #F9E2AF;">Result</span><span style="color: #94E2D5;">::</span><span style="color: #89B4FA;font-style: italic;">map</span><span style="color: #9399B2;">(</span></span>
+<span class="giallo-l"><span style="color: #F9E2AF;">  std</span><span style="color: #94E2D5;">::</span><span style="color: #F9E2AF;">result</span><span style="color: #94E2D5;">::</span><span style="color: #F9E2AF;">Result</span><span style="color: #94E2D5;">::</span><span style="color: #89B4FA;font-style: italic;">map</span><span style="color: #9399B2;">(</span><span style="color: #94E2D5;">&amp;</span><span>result</span><span style="color: #9399B2;">,</span><span> add_one</span><span style="color: #9399B2;">),</span><span> add_one</span><span style="color: #9399B2;">),</span><span> add_one</span><span style="color: #9399B2;">),</span></span>
+<span class="giallo-l"><span style="color: #FAB387;">  0</span><span style="color: #9399B2;">);</span></span></code></pre>
+<p>And the pipe operator in so many functional languages also serves the same purpose: as syntax sugar. Anyways, I just found this kind of neat, and my guess as to a little bit about why there isn’t a pipe operator in rust yet, despite taking so much heavy influence from functional languages like OCaml.</p>
+</div>
+  </article>
+
+      </section>
+    </main>
+
+    <div class="kaomoji-sidebar kaomoji-right">
+      <div class="scroll-text" id="kaomoji-right"></div>
+    </div>
+  </div>
+
+  <script>
+    // Smooth scrolling for internal links
+    document.querySelectorAll('nav a').forEach(anchor => {
+      anchor.addEventListener('click', function (e) {
+        const href = this.getAttribute('href');
+        if (href && href.startsWith('#')) {
+          e.preventDefault();
+          document.querySelector(href).scrollIntoView({ behavior: 'smooth' });
+        }
+      });
+    });
+
+    // Fetch kaomoji text if available
+    fetch('https://taranathan.com/kaomoji.txt').then(r => { if (r.ok) return r.text(); }).then(data => {
+      if (data) {
+        const l = document.getElementById('kaomoji-left');
+        const rgt = document.getElementById('kaomoji-right');
+        if (l) l.textContent = data;
+        if (rgt) rgt.textContent = data;
+      }
+    }).catch(()=>{});
+  </script>
+</body>
+
+</html>
index 43c19d4152e46d9e9c44738439200c1ff95fd83d..3e1f705929e48402266d527e4e4a27d36216c8f7 100644 (file)
@@ -29,4 +29,8 @@
         <loc>https://taranathan.com/miniblog/gitweb/</loc>
         <lastmod>2026-06-01</lastmod>
     </url>
+    <url>
+        <loc>https://taranathan.com/miniblog/pipes/</loc>
+        <lastmod>2026-06-22</lastmod>
+    </url>
 </urlset>
diff --git a/sass/styles.css b/sass/styles.css
new file mode 100644 (file)
index 0000000..c53d876
--- /dev/null
@@ -0,0 +1,289 @@
+html {
+  background-color: linen; }
+
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+  border-radius: 5%;
+  /* background-color: linen; */ }
+
+@font-face {
+  font-family: 'Funnel';
+  src: url("fonts/Funnel_Display/static/FunnelDisplay-SemiBold.ttf") format("truetype"); }
+
+@font-face {
+  font-family: 'BoldFunnel';
+  src: url("fonts/Funnel_Display/static/FunnelDisplay-Bold.ttf") format("truetype"); }
+
+@font-face {
+  font-family: 'Dosis';
+  src: url("fonts/Dosis/static/Dosis-Medium.ttf") format("truetype"); }
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-family: Funnel, Arial; }
+
+p,
+a {
+  font-family: Dosis, Arial;
+  margin-top: .5rem;
+  margin-bottom: .5rem; }
+
+body {
+  min-height: 100vh;
+  overflow-x: hidden;
+  background: linen;
+  display: flex; }
+
+.container {
+  display: flex;
+  width: 100%;
+  min-height: 100vh;
+  position: relative; }
+
+.kaomoji-sidebar {
+  position: fixed;
+  top: 0;
+  height: 100vh;
+  width: 60px;
+  font-size: 24px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: linen;
+  overflow: hidden;
+  z-index: 100; }
+
+.kaomoji-sidebar .scroll-text {
+  transform: rotate(0.25turn);
+  white-space: nowrap;
+  animation: scroll 90s linear infinite; }
+
+.kaomoji-left {
+  left: 0;
+  border-right: 1px solid #000; }
+
+.kaomoji-right {
+  right: 0;
+  border-left: 1px solid #000; }
+
+.kaomoji-right .scroll-text {
+  transform: rotate(0.5turn); }
+
+@keyframes scroll {
+  0% {
+    transform: rotate(90deg) translateX(-64%); }
+  100% {
+    transform: rotate(90deg) translateX(80%); } }
+
+.content {
+  flex: 1;
+  margin: 0 60px;
+  padding: 20px;
+  width: calc(100% - 120px);
+  max-width: 1400px;
+  margin-left: auto;
+  margin-right: auto;
+  position: relative; }
+
+.section-container {
+  position: relative;
+  margin-bottom: 40px; }
+
+.header {
+  position: relative;
+  padding: 40px;
+  margin-left: 40px;
+  background: transparent;
+  margin-bottom: 40px; }
+  .header h1 {
+    font-family: BoldFunnel; }
+
+.header .nav .prooject {
+  text-size-adjust: .5; }
+
+.header::after {
+  content: '';
+  position: absolute;
+  bottom: -20px;
+  /* Position it outside the padding */
+  left: -60px;
+  /* Extend past the left padding to reach sidebar */
+  width: calc(100% + 120px);
+  /* Add extra width to reach both sidebars */
+  height: 2px;
+  background: #000;
+  transform: rotate(-3deg);
+  transform-origin: center; }
+
+.about-section {
+  position: relative;
+  padding: 40px;
+  background: transparent;
+  margin-bottom: 40px;
+  margin-left: 20px; }
+
+.project-section {
+  position: relative;
+  padding: 40px;
+  background: linen;
+  margin-bottom: 40px;
+  margin-left: 20px;
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 40px;
+  align-items: center; }
+
+.project-section::before {
+  content: '';
+  position: absolute;
+  top: -20px;
+  left: -60px;
+  width: calc(100% + 120px);
+  height: 2px;
+  background: #000;
+  transform: rotate(3deg);
+  transform-origin: center; }
+
+.more-section {
+  position: relative;
+  padding: 40px;
+  margin-left: 20px;
+  background: linen; }
+
+.more-section::before {
+  content: '';
+  position: absolute;
+  top: -20px;
+  left: -60px;
+  width: calc(100% + 120px);
+  height: 2px;
+  background: #000;
+  transform: rotate(-5deg);
+  transform-origin: center; }
+
+.image-placeholder {
+  border: 3px dashed #000;
+  border-radius: 10px;
+  height: 300px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 24px; }
+
+nav {
+  display: flex;
+  gap: 20px;
+  margin-top: 20px; }
+
+nav a {
+  color: #000;
+  text-decoration: none;
+  font-weight: bold; }
+
+nav a:hover {
+  text-decoration: underline; }
+
+h1 a {
+  color: #000;
+  text-decoration: none; }
+
+h1 a:hover {
+  text-decoration: underline; }
+
+h1 {
+  font-size: 2.5em;
+  margin-bottom: 10px;
+  color: #000; }
+
+h2 {
+  font-size: 2em;
+  margin-bottom: 20px;
+  color: #000; }
+
+p {
+  font-size: 1.1em;
+  line-height: 1.6;
+  color: #000; }
+
+.content-body,
+.post,
+.about-section,
+.project-section,
+.more-section {
+  position: relative;
+  padding: 40px;
+  margin-left: 20px;
+  background: transparent; }
+
+.section-title {
+  font-size: 2.1em;
+  margin-bottom: 24px; }
+
+.post-list {
+  list-style: none;
+  display: flex;
+  flex-direction: column;
+  gap: 24px; }
+
+.post-list-item {
+  position: relative;
+  padding-bottom: 20px; }
+
+.post-list-item::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  height: 1px;
+  background: #000;
+  transform: rotate(-1deg); }
+
+.post-list-item a {
+  color: #000;
+  text-decoration: none;
+  font-size: 1.3em; }
+
+.post-list-item a:hover {
+  text-decoration: underline; }
+
+.post-excerpt,
+.post-content {
+  margin-top: 12px; }
+
+.subtitle {
+  margin-bottom: 20px; }
+
+.miniblog-post {
+  padding-top: 28px;
+  padding-bottom: 28px; }
+
+@media (max-width: 768px) {
+  .project-section {
+    grid-template-columns: 1fr; }
+  .content-body,
+  .post,
+  .about-section,
+  .project-section,
+  .more-section {
+    padding: 24px; } }
+
+.decorations .stronk {
+  transform: rotate(6deg);
+  text-align: center; }
+
+.woah {
+  transform: rotate(-8deg);
+  text-align: middle;
+  vertical-align: top;
+  font-family: Arial, Helvetica, sans-serif; }
+
+.giallo {
+  border-radius: 5px;
+  padding: 1rem; }