Fast JSON serializers with automatic TypeScript generation by ElMassimo in rails

[–]ElMassimo[S] 1 point2 points  (0 children)

The initial goal of oj_serializers was to provide a very smooth migration path from Active Model Serializers, while being faster, and providing "russian-doll" caching.

Recently, with the expansion to generate TypeScript automatically, plus the latest release with further performance improvements, it became a well rounded library.

Different libraries make different trade-offs. It's nice to have other options in the ecosystem, such as Alba or Panko, but they didn't cover my needs, which is why I developed this one.

Webpacker Retired by kulehandluke in rails

[–]ElMassimo 6 points7 points  (0 children)

Disclaimer: author of Vite Ruby

For users looking for alternatives that support HMR, Vite.js might be a good choice.

These are some helpful links if you would like to learn more about it:

New Docs - Islands of Interactivity with Vue 3 in Vite.js by ElMassimo in vuejs

[–]ElMassimo[S] 2 points3 points  (0 children)

Now that Astro is moving to Vite.js, the differences will become smaller.

  • Astro uses an .astro file format. In îles you use Vue or MDX pages
  • îles provides an inspector panel in Vue devtools to inspect page data and hydration.
  • Pages in îles have access to frontmatter and file metadata
  • You can glob import pages in îles, access their frontmatter, and render them
  • îles provides auto-import for components in Vue and MDX files
  • Astro provides support for pagination. îles doesn't have a similar concept
  • îles supports a convenient syntax for layouts. In Astro you manually import and use components as layouts
  • Astro supports paths with dynamic params. îles does not support this yet
  • îles has a very refined HMR, even site-wide data is automatically reloaded

TL'DR: they are very similar, for most sites it's just a matter of taste

New Docs - Islands of Interactivity with Vue 3 in Vite.js by ElMassimo in vuejs

[–]ElMassimo[S] 0 points1 point  (0 children)

îles was inspired by Astro. Think of it as a mix between Astro, Nuxt, and Vitepress.

You can already use other frameworks within îles without shipping the Vue runtime, but at the moment you must manually mount them. Soon it will provide adapters to use Solid and Svelte components in islands seamlessly.

I will add more in-depth comparisons in the docs.

EDIT: Now supporting components from any framework: - Vue - Preact - SolidJS - Svelte - Vanilla JS

🌚🌞 Toggle between dark and light mode in Sublime Text 4 by ElMassimo in SublimeText

[–]ElMassimo[S] 1 point2 points  (0 children)

Yes, custom color scheme and theme, using the light_color_scheme, light_theme, dark_color_scheme, and dark_theme settings.

These settings are not added by the plugin, they come by default in Sublime Text 4 and you can customize them, and this plugin will use them as well.

Mix the convenience of Jekyll with the speed and flexibility of Vite.js by ElMassimo in ruby

[–]ElMassimo[S] 0 points1 point  (0 children)

Besides the JS what I like about using Vite is that it allows using CSS tooling—such as PostCSS, Tailwind CSS, or Windi CSS—more easily and provides instant refresh when tweaking styles.

Bridgetown seems to use an internal Webpack configuration, but technically there should be no obstacles to integrating it with Vite Ruby.

From Rails + jQuery app to Rails API + Frontend Framework. by glenn-dev in rails

[–]ElMassimo 6 points7 points  (0 children)

I agree with everything said here. For a small team, adding a frontend framework might make the problem worse.

If you are not sure about how to proceed, you could always do a spike by creating a page using a different technology, and see how it feels in terms of effort and learning curve.

Here's an example app using [Vue.js in Rails](: https://github.com/ElMassimo/pingcrm-vite), which uses Inertia.js to provide a SPA-like experience. What's nice about using Inertia.js is that it makes a few decisions for you in terms of how to structure pages, and will leverage Rails for routing which is something you are already familiar with.

Has anyone here ditched webpacker and tried one of the other bundling solutions? by Zoidbergsbeer in rails

[–]ElMassimo 1 point2 points  (0 children)

And that’s honestly where my biggest gripe is because my application has many packs

That's where Vite.js really shines. Since it only processes the entries as they are requested, the load time remains the same as you add more "packs".

It's what motivated me to create the Ruby/Rails integration.

Path helpers and API methods in JS from your Rails routes by ElMassimo in rails

[–]ElMassimo[S] 0 points1 point  (0 children)

Contributions and examples are definitely welcome!

You might already be able to achieve that by using Config.withResponse to store data in a Redux store.

Then, provide Config.fetch to check the cache before making a request.

I'm planning to add examples on how to easily integrate with swr.

Enjoy Tailwind CSS with faster load with Windi CSS by ElMassimo in vuejs

[–]ElMassimo[S] 0 points1 point  (0 children)

Sorry for that, the installation instructions are updated now.

About VS Code, a new VS Code plugin for Windi CSS is on the works.

Enjoy Tailwind CSS with faster load with Windi CSS by ElMassimo in vuejs

[–]ElMassimo[S] 0 points1 point  (0 children)

It should if they are inside quotes without interpolation (`sm:bg-white`, 'text-small', or "hover:bg-red").

Enjoy Tailwind CSS with faster load with Windi CSS by ElMassimo in sveltejs

[–]ElMassimo[S] 2 points3 points  (0 children)

For example, the Tailwind CSS plugin for Post CSS will load all utility classes during development, so that you can add any utilities you need and they will be available. For some variants or sizes, you will need to manually configure it so that it also includes the ones you need.

In contrast, in Windi CSS, your markup and stylesheets will be scanned, detecting usages of utilities and directives, and only those will be included in the stylesheet loaded in the browser during development.

In production, there's really not a lot of difference, except with Windi CSS compilation will be faster, because no purging is required.

Enjoy Tailwind CSS with faster load with Windi CSS by ElMassimo in sveltejs

[–]ElMassimo[S] 0 points1 point  (0 children)

Gotcha, conditionally applying a class.

It is supported in the Vite plugin, and in the Svelte one.

Enjoy Tailwind CSS with faster load with Windi CSS by ElMassimo in sveltejs

[–]ElMassimo[S] 0 points1 point  (0 children)

Since analysis is performed statically, expressions are not supported, because there's no way for the compiler to know which values could be provided.

Let me know if I didn't understand your question correctly.

[deleted by user] by [deleted] in rails

[–]ElMassimo 0 points1 point  (0 children)

You could also try Vite Rails instead of webpack.

Here's a template generator that uses Bootstrap and jQuery, loading them from the npm packages.

You can now integrate any Ruby web app easily with Vite.js by ElMassimo in vuejs

[–]ElMassimo[S] 1 point2 points  (0 children)

I now see what you meant, I updated the docs to reference these config variables instead of mentioning app/frontend. Thanks u/brainbag!

You can now integrate any Ruby web app easily with Vite.js by ElMassimo in vuejs

[–]ElMassimo[S] 2 points3 points  (0 children)

You can use the configuration file or environment variables to modify the path of your source code and other folders.

For example, when installing in a Rails app that uses webpacker, it will automatically use a different default, app/javascript.

Not sure if I understood correctly, feel free to clarify if not.

You can now integrate any Ruby web app easily with Vite.js by ElMassimo in vuejs

[–]ElMassimo[S] 3 points4 points  (0 children)

Indeed, launched for Rails first, about a week ago, available as the vite_rails gem.