diff --git a/CHANGELOG.md b/CHANGELOG.md
index 1e93259770..a2267a88a8 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -29,8 +29,9 @@
 - Feat: プラグイン・テーマを外部サイトから直接インストールできるようになりました
 	- 外部サイトでの実装が必要です。詳細は Misskey Hub をご覧ください
 	  https://misskey-hub.net/docs/advanced/publish-on-your-website.html
+- Feat: 通知をグルーピングして表示するオプション(オプトアウト)
 - Feat: Misskeyの基本的なチュートリアルを実装
-- Enhance: スワイプしてタイムラインを再読込できるように
+- Feat: スワイプしてタイムラインを再読込できるように
 	- PCの場合は右上のボタンからでも再読込できます
 - Enhance: タイムラインの自動更新を無効にできるように
 - Enhance: コードのシンタックスハイライトエンジンをShikiに変更
diff --git a/locales/index.d.ts b/locales/index.d.ts
index 157790a94c..18404d5571 100644
--- a/locales/index.d.ts
+++ b/locales/index.d.ts
@@ -1157,6 +1157,7 @@ export interface Locale {
     "refreshing": string;
     "pullDownToRefresh": string;
     "disableStreamingTimeline": string;
+    "useGroupedNotifications": string;
     "_announcement": {
         "forExistingUsers": string;
         "forExistingUsersDescription": string;
@@ -2270,6 +2271,9 @@ export interface Locale {
         "checkNotificationBehavior": string;
         "sendTestNotification": string;
         "notificationWillBeDisplayedLikeThis": string;
+        "reactedBySomeUsers": string;
+        "renotedBySomeUsers": string;
+        "followedBySomeUsers": string;
         "_types": {
             "all": string;
             "note": string;
diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index da5bb69d78..a5d95f13ae 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -1135,8 +1135,8 @@ showRepliesToOthersInTimeline: "TLに他の人への返信を含める"
 hideRepliesToOthersInTimeline: "TLに他の人への返信を含めない"
 showRepliesToOthersInTimelineAll: "TLに現在フォロー中の人全員の返信を含めるようにする"
 hideRepliesToOthersInTimelineAll: "TLに現在フォロー中の人全員の返信を含めないようにする"
-confirmShowRepliesAll: "この操作は元の戻せません。本当にTLに現在フォロー中の人全員の返信を含めるようにしますか"
-confirmHideRepliesAll: "この操作は元の戻せません。本当にTLに現在フォロー中の人全員の返信を含めないようにしますか"
+confirmShowRepliesAll: "この操作は元に戻せません。本当にTLに現在フォロー中の人全員の返信を含めるようにしますか?"
+confirmHideRepliesAll: "この操作は元に戻せません。本当にTLに現在フォロー中の人全員の返信を含めないようにしますか?"
 externalServices: "外部サービス"
 impressum: "運営者情報"
 impressumUrl: "運営者情報URL"
@@ -1154,6 +1154,7 @@ releaseToRefresh: "離してリロード"
 refreshing: "リロード中"
 pullDownToRefresh: "引っ張ってリロード"
 disableStreamingTimeline: "タイムラインのリアルタイム更新を無効にする"
+useGroupedNotifications: "通知をグルーピングして表示する"
 
 _announcement:
   forExistingUsers: "既存ユーザーのみ"
@@ -2173,6 +2174,9 @@ _notification:
   checkNotificationBehavior: "通知の表示を確かめる"
   sendTestNotification: "テスト通知を送信する"
   notificationWillBeDisplayedLikeThis: "通知はこのように表示されます"
+  reactedBySomeUsers: "{n}人がリアクションしました"
+  renotedBySomeUsers: "{n}人がリノートしました"
+  followedBySomeUsers: "{n}人にフォローされました"
 
   _types:
     all: "すべて"
diff --git a/package.json b/package.json
index d4de09c9a6..4915d64da1 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "misskey",
-	"version": "2023.11.0-beta.7",
+	"version": "2023.11.0-beta.8",
 	"codename": "nasubi",
 	"repository": {
 		"type": "git",
diff --git a/packages/backend/src/core/NoteCreateService.ts b/packages/backend/src/core/NoteCreateService.ts
index 6caa3d463c..acd11a9fa7 100644
--- a/packages/backend/src/core/NoteCreateService.ts
+++ b/packages/backend/src/core/NoteCreateService.ts
@@ -100,17 +100,14 @@ class NotificationManager {
 	}
 
 	@bindThis
-	public async deliver() {
+	public async notify() {
 		for (const x of this.queue) {
-			// ミュート情報を取得
-			const mentioneeMutes = await this.mutingsRepository.findBy({
-				muterId: x.target,
-			});
-
-			const mentioneesMutedUserIds = mentioneeMutes.map(m => m.muteeId);
-
-			// 通知される側のユーザーが通知する側のユーザーをミュートしていない限りは通知する
-			if (!mentioneesMutedUserIds.includes(this.notifier.id)) {
+			if (x.reason === 'renote') {
+				this.notificationService.createNotification(x.target, 'renote', {
+					noteId: this.note.id,
+					targetNoteId: this.note.renoteId!,
+				}, this.notifier.id);
+			} else {
 				this.notificationService.createNotification(x.target, x.reason, {
 					noteId: this.note.id,
 				}, this.notifier.id);
@@ -642,7 +639,7 @@ export class NoteCreateService implements OnApplicationShutdown {
 				}
 			}
 
-			nm.deliver();
+			nm.notify();
 
 			//#region AP deliver
 			if (this.userEntityService.isLocalUser(user)) {
diff --git a/packages/backend/src/core/NotificationService.ts b/packages/backend/src/core/NotificationService.ts
index 7c3672c67a..ad7be83e5b 100644
--- a/packages/backend/src/core/NotificationService.ts
+++ b/packages/backend/src/core/NotificationService.ts
@@ -19,6 +19,7 @@ import { IdService } from '@/core/IdService.js';
 import { CacheService } from '@/core/CacheService.js';
 import type { Config } from '@/config.js';
 import { UserListService } from '@/core/UserListService.js';
+import type { FilterUnionByProperty } from '@/types.js';
 
 @Injectable()
 export class NotificationService implements OnApplicationShutdown {
@@ -73,10 +74,10 @@ export class NotificationService implements OnApplicationShutdown {
 	}
 
 	@bindThis
-	public async createNotification(
+	public async createNotification<T extends MiNotification['type']>(
 		notifieeId: MiUser['id'],
-		type: MiNotification['type'],
-		data: Omit<Partial<MiNotification>, 'notifierId'>,
+		type: T,
+		data: Omit<FilterUnionByProperty<MiNotification, 'type', T>, 'type' | 'id' | 'createdAt' | 'notifierId'>,
 		notifierId?: MiUser['id'] | null,
 	): Promise<MiNotification | null> {
 		const profile = await this.cacheService.userProfileCache.fetch(notifieeId);
@@ -128,9 +129,11 @@ export class NotificationService implements OnApplicationShutdown {
 			id: this.idService.gen(),
 			createdAt: new Date(),
 			type: type,
-			notifierId: notifierId,
+			...(notifierId ? {
+				notifierId,
+			} : {}),
 			...data,
-		} as MiNotification;
+		} as any as FilterUnionByProperty<MiNotification, 'type', T>;
 
 		const redisIdPromise = this.redisClient.xadd(
 			`notificationTimeline:${notifieeId}`,
diff --git a/packages/backend/src/core/UserFollowingService.ts b/packages/backend/src/core/UserFollowingService.ts
index 4d7e14f683..bd7f298021 100644
--- a/packages/backend/src/core/UserFollowingService.ts
+++ b/packages/backend/src/core/UserFollowingService.ts
@@ -509,7 +509,6 @@ export class UserFollowingService implements OnModuleInit {
 
 			// 通知を作成
 			this.notificationService.createNotification(followee.id, 'receiveFollowRequest', {
-				followRequestId: followRequest.id,
 			}, follower.id);
 		}
 
diff --git a/packages/backend/src/core/entities/NotificationEntityService.ts b/packages/backend/src/core/entities/NotificationEntityService.ts
index 9542815bd7..f74594ff0c 100644
--- a/packages/backend/src/core/entities/NotificationEntityService.ts
+++ b/packages/backend/src/core/entities/NotificationEntityService.ts
@@ -9,18 +9,19 @@ import { In } from 'typeorm';
 import { DI } from '@/di-symbols.js';
 import type { FollowRequestsRepository, NotesRepository, MiUser, UsersRepository } from '@/models/_.js';
 import { awaitAll } from '@/misc/prelude/await-all.js';
-import type { MiNotification } from '@/models/Notification.js';
+import type { MiGroupedNotification, MiNotification } from '@/models/Notification.js';
 import type { MiNote } from '@/models/Note.js';
 import type { Packed } from '@/misc/json-schema.js';
 import { bindThis } from '@/decorators.js';
 import { isNotNull } from '@/misc/is-not-null.js';
-import { notificationTypes } from '@/types.js';
+import { FilterUnionByProperty, notificationTypes } from '@/types.js';
 import type { OnModuleInit } from '@nestjs/common';
 import type { CustomEmojiService } from '../CustomEmojiService.js';
 import type { UserEntityService } from './UserEntityService.js';
 import type { NoteEntityService } from './NoteEntityService.js';
 
 const NOTE_REQUIRED_NOTIFICATION_TYPES = new Set(['note', 'mention', 'reply', 'renote', 'quote', 'reaction', 'pollEnded'] as (typeof notificationTypes[number])[]);
+const NOTE_REQUIRED_GROUPED_NOTIFICATION_TYPES = new Set(['note', 'mention', 'reply', 'renote', 'renote:grouped', 'quote', 'reaction', 'reaction:grouped', 'pollEnded']);
 
 @Injectable()
 export class NotificationEntityService implements OnModuleInit {
@@ -66,17 +67,17 @@ export class NotificationEntityService implements OnModuleInit {
 		},
 	): Promise<Packed<'Notification'>> {
 		const notification = src;
-		const noteIfNeed = NOTE_REQUIRED_NOTIFICATION_TYPES.has(notification.type) && notification.noteId != null ? (
+		const noteIfNeed = NOTE_REQUIRED_NOTIFICATION_TYPES.has(notification.type) && 'noteId' in notification ? (
 			hint?.packedNotes != null
 				? hint.packedNotes.get(notification.noteId)
-				: this.noteEntityService.pack(notification.noteId!, { id: meId }, {
+				: this.noteEntityService.pack(notification.noteId, { id: meId }, {
 					detail: true,
 				})
 		) : undefined;
-		const userIfNeed = notification.notifierId != null ? (
+		const userIfNeed = 'notifierId' in notification ? (
 			hint?.packedUsers != null
 				? hint.packedUsers.get(notification.notifierId)
-				: this.userEntityService.pack(notification.notifierId!, { id: meId }, {
+				: this.userEntityService.pack(notification.notifierId, { id: meId }, {
 					detail: false,
 				})
 		) : undefined;
@@ -85,7 +86,7 @@ export class NotificationEntityService implements OnModuleInit {
 			id: notification.id,
 			createdAt: new Date(notification.createdAt).toISOString(),
 			type: notification.type,
-			userId: notification.notifierId,
+			userId: 'notifierId' in notification ? notification.notifierId : undefined,
 			...(userIfNeed != null ? { user: userIfNeed } : {}),
 			...(noteIfNeed != null ? { note: noteIfNeed } : {}),
 			...(notification.type === 'reaction' ? {
@@ -111,7 +112,7 @@ export class NotificationEntityService implements OnModuleInit {
 
 		let validNotifications = notifications;
 
-		const noteIds = validNotifications.map(x => x.noteId).filter(isNotNull);
+		const noteIds = validNotifications.map(x => 'noteId' in x ? x.noteId : null).filter(isNotNull);
 		const notes = noteIds.length > 0 ? await this.notesRepository.find({
 			where: { id: In(noteIds) },
 			relations: ['user', 'reply', 'reply.user', 'renote', 'renote.user'],
@@ -121,9 +122,9 @@ export class NotificationEntityService implements OnModuleInit {
 		});
 		const packedNotes = new Map(packedNotesArray.map(p => [p.id, p]));
 
-		validNotifications = validNotifications.filter(x => x.noteId == null || packedNotes.has(x.noteId));
+		validNotifications = validNotifications.filter(x => !('noteId' in x) || packedNotes.has(x.noteId));
 
-		const userIds = validNotifications.map(x => x.notifierId).filter(isNotNull);
+		const userIds = validNotifications.map(x => 'notifierId' in x ? x.notifierId : null).filter(isNotNull);
 		const users = userIds.length > 0 ? await this.usersRepository.find({
 			where: { id: In(userIds) },
 		}) : [];
@@ -133,10 +134,10 @@ export class NotificationEntityService implements OnModuleInit {
 		const packedUsers = new Map(packedUsersArray.map(p => [p.id, p]));
 
 		// 既に解決されたフォローリクエストの通知を除外
-		const followRequestNotifications = validNotifications.filter(x => x.type === 'receiveFollowRequest');
+		const followRequestNotifications = validNotifications.filter((x): x is FilterUnionByProperty<MiGroupedNotification, 'type', 'receiveFollowRequest'> => x.type === 'receiveFollowRequest');
 		if (followRequestNotifications.length > 0) {
 			const reqs = await this.followRequestsRepository.find({
-				where: { followerId: In(followRequestNotifications.map(x => x.notifierId!)) },
+				where: { followerId: In(followRequestNotifications.map(x => x.notifierId)) },
 			});
 			validNotifications = validNotifications.filter(x => (x.type !== 'receiveFollowRequest') || reqs.some(r => r.followerId === x.notifierId));
 		}
@@ -146,4 +147,141 @@ export class NotificationEntityService implements OnModuleInit {
 			packedUsers,
 		})));
 	}
+
+	@bindThis
+	public async packGrouped(
+		src: MiGroupedNotification,
+		meId: MiUser['id'],
+		// eslint-disable-next-line @typescript-eslint/ban-types
+		options: {
+
+		},
+		hint?: {
+			packedNotes: Map<MiNote['id'], Packed<'Note'>>;
+			packedUsers: Map<MiUser['id'], Packed<'User'>>;
+		},
+	): Promise<Packed<'Notification'>> {
+		const notification = src;
+		const noteIfNeed = NOTE_REQUIRED_GROUPED_NOTIFICATION_TYPES.has(notification.type) && 'noteId' in notification ? (
+			hint?.packedNotes != null
+				? hint.packedNotes.get(notification.noteId)
+				: this.noteEntityService.pack(notification.noteId, { id: meId }, {
+					detail: true,
+				})
+		) : undefined;
+		const userIfNeed = 'notifierId' in notification ? (
+			hint?.packedUsers != null
+				? hint.packedUsers.get(notification.notifierId)
+				: this.userEntityService.pack(notification.notifierId, { id: meId }, {
+					detail: false,
+				})
+		) : undefined;
+
+		if (notification.type === 'reaction:grouped') {
+			const reactions = await Promise.all(notification.reactions.map(async reaction => {
+				const user = hint?.packedUsers != null
+					? hint.packedUsers.get(reaction.userId)!
+					: await this.userEntityService.pack(reaction.userId, { id: meId }, {
+						detail: false,
+					});
+				return {
+					user,
+					reaction: reaction.reaction,
+				};
+			}));
+			return await awaitAll({
+				id: notification.id,
+				createdAt: new Date(notification.createdAt).toISOString(),
+				type: notification.type,
+				note: noteIfNeed,
+				reactions,
+			});
+		} else if (notification.type === 'renote:grouped') {
+			const users = await Promise.all(notification.userIds.map(userId => {
+				const user = hint?.packedUsers != null
+					? hint.packedUsers.get(userId)
+					: this.userEntityService.pack(userId!, { id: meId }, {
+						detail: false,
+					});
+				return user;
+			}));
+			return await awaitAll({
+				id: notification.id,
+				createdAt: new Date(notification.createdAt).toISOString(),
+				type: notification.type,
+				note: noteIfNeed,
+				users,
+			});
+		}
+
+		return await awaitAll({
+			id: notification.id,
+			createdAt: new Date(notification.createdAt).toISOString(),
+			type: notification.type,
+			userId: 'notifierId' in notification ? notification.notifierId : undefined,
+			...(userIfNeed != null ? { user: userIfNeed } : {}),
+			...(noteIfNeed != null ? { note: noteIfNeed } : {}),
+			...(notification.type === 'reaction' ? {
+				reaction: notification.reaction,
+			} : {}),
+			...(notification.type === 'achievementEarned' ? {
+				achievement: notification.achievement,
+			} : {}),
+			...(notification.type === 'app' ? {
+				body: notification.customBody,
+				header: notification.customHeader,
+				icon: notification.customIcon,
+			} : {}),
+		});
+	}
+
+	@bindThis
+	public async packGroupedMany(
+		notifications: MiGroupedNotification[],
+		meId: MiUser['id'],
+	) {
+		if (notifications.length === 0) return [];
+
+		let validNotifications = notifications;
+
+		const noteIds = validNotifications.map(x => 'noteId' in x ? x.noteId : null).filter(isNotNull);
+		const notes = noteIds.length > 0 ? await this.notesRepository.find({
+			where: { id: In(noteIds) },
+			relations: ['user', 'reply', 'reply.user', 'renote', 'renote.user'],
+		}) : [];
+		const packedNotesArray = await this.noteEntityService.packMany(notes, { id: meId }, {
+			detail: true,
+		});
+		const packedNotes = new Map(packedNotesArray.map(p => [p.id, p]));
+
+		validNotifications = validNotifications.filter(x => !('noteId' in x) || packedNotes.has(x.noteId));
+
+		const userIds = [];
+		for (const notification of validNotifications) {
+			if ('notifierId' in notification) userIds.push(notification.notifierId);
+			if (notification.type === 'reaction:grouped') userIds.push(...notification.reactions.map(x => x.userId));
+			if (notification.type === 'renote:grouped') userIds.push(...notification.userIds);
+		}
+		const users = userIds.length > 0 ? await this.usersRepository.find({
+			where: { id: In(userIds) },
+		}) : [];
+		const packedUsersArray = await this.userEntityService.packMany(users, { id: meId }, {
+			detail: false,
+		});
+		const packedUsers = new Map(packedUsersArray.map(p => [p.id, p]));
+
+		// 既に解決されたフォローリクエストの通知を除外
+		const followRequestNotifications = validNotifications.filter((x): x is FilterUnionByProperty<MiGroupedNotification, 'type', 'receiveFollowRequest'> => x.type === 'receiveFollowRequest');
+		if (followRequestNotifications.length > 0) {
+			const reqs = await this.followRequestsRepository.find({
+				where: { followerId: In(followRequestNotifications.map(x => x.notifierId)) },
+			});
+			validNotifications = validNotifications.filter(x => (x.type !== 'receiveFollowRequest') || reqs.some(r => r.followerId === x.notifierId));
+		}
+
+		return await Promise.all(validNotifications.map(x => this.packGrouped(x, meId, {}, {
+			packedNotes,
+			packedUsers,
+		})));
+	}
 }
diff --git a/packages/backend/src/models/Notification.ts b/packages/backend/src/models/Notification.ts
index c0a9df2e23..1d5fc124e2 100644
--- a/packages/backend/src/models/Notification.ts
+++ b/packages/backend/src/models/Notification.ts
@@ -10,30 +10,73 @@ import { MiFollowRequest } from './FollowRequest.js';
 import { MiAccessToken } from './AccessToken.js';
 
 export type MiNotification = {
+	type: 'note';
+	id: string;
+	createdAt: string;
+	notifierId: MiUser['id'];
+	noteId: MiNote['id'];
+} | {
+	type: 'follow';
+	id: string;
+	createdAt: string;
+	notifierId: MiUser['id'];
+} | {
+	type: 'mention';
+	id: string;
+	createdAt: string;
+	notifierId: MiUser['id'];
+	noteId: MiNote['id'];
+} | {
+	type: 'reply';
+	id: string;
+	createdAt: string;
+	notifierId: MiUser['id'];
+	noteId: MiNote['id'];
+} | {
+	type: 'renote';
+	id: string;
+	createdAt: string;
+	notifierId: MiUser['id'];
+	noteId: MiNote['id'];
+	targetNoteId: MiNote['id'];
+} | {
+	type: 'quote';
+	id: string;
+	createdAt: string;
+	notifierId: MiUser['id'];
+	noteId: MiNote['id'];
+} | {
+	type: 'reaction';
+	id: string;
+	createdAt: string;
+	notifierId: MiUser['id'];
+	noteId: MiNote['id'];
+	reaction: string;
+} | {
+	type: 'pollEnded';
+	id: string;
+	createdAt: string;
+	notifierId: MiUser['id'];
+	noteId: MiNote['id'];
+} | {
+	type: 'receiveFollowRequest';
+	id: string;
+	createdAt: string;
+	notifierId: MiUser['id'];
+} | {
+	type: 'followRequestAccepted';
+	id: string;
+	createdAt: string;
+	notifierId: MiUser['id'];
+} | {
+	type: 'achievementEarned';
+	id: string;
+	createdAt: string;
+	achievement: string;
+} | {
+	type: 'app';
 	id: string;
-
-	// RedisのためDateではなくstring
 	createdAt: string;
-
-	/**
-	 * 通知の送信者(initiator)
-	 */
-	notifierId: MiUser['id'] | null;
-
-	/**
-	 * 通知の種類。
-	 */
-	type: typeof notificationTypes[number];
-
-	noteId: MiNote['id'] | null;
-
-	followRequestId: MiFollowRequest['id'] | null;
-
-	reaction: string | null;
-
-	choice: number | null;
-
-	achievement: string | null;
 
 	/**
 	 * アプリ通知のbody
@@ -56,4 +99,25 @@ export type MiNotification = {
 	 * アプリ通知のアプリ(のトークン)
 	 */
 	appAccessTokenId: MiAccessToken['id'] | null;
-}
+} | {
+	type: 'test';
+	id: string;
+	createdAt: string;
+};
+
+export type MiGroupedNotification = MiNotification | {
+	type: 'reaction:grouped';
+	id: string;
+	createdAt: string;
+	noteId: MiNote['id'];
+	reactions: {
+		userId: string;
+		reaction: string;
+	}[];
+} | {
+	type: 'renote:grouped';
+	id: string;
+	createdAt: string;
+	noteId: MiNote['id'];
+	userIds: string[];
+};
diff --git a/packages/backend/src/models/json-schema/notification.ts b/packages/backend/src/models/json-schema/notification.ts
index 2c434913da..27db3bb62c 100644
--- a/packages/backend/src/models/json-schema/notification.ts
+++ b/packages/backend/src/models/json-schema/notification.ts
@@ -12,7 +12,6 @@ export const packedNotificationSchema = {
 			type: 'string',
 			optional: false, nullable: false,
 			format: 'id',
-			example: 'xxxxxxxxxx',
 		},
 		createdAt: {
 			type: 'string',
@@ -22,7 +21,7 @@ export const packedNotificationSchema = {
 		type: {
 			type: 'string',
 			optional: false, nullable: false,
-			enum: [...notificationTypes],
+			enum: [...notificationTypes, 'reaction:grouped', 'renote:grouped'],
 		},
 		user: {
 			type: 'object',
@@ -63,5 +62,33 @@ export const packedNotificationSchema = {
 			type: 'string',
 			optional: true, nullable: true,
 		},
+		reactions: {
+			type: 'array',
+			optional: true, nullable: true,
+			items: {
+				type: 'object',
+				properties: {
+					user: {
+						type: 'object',
+						ref: 'UserLite',
+						optional: false, nullable: false,
+					},
+					reaction: {
+						type: 'string',
+						optional: false, nullable: false,
+					},
+				},
+				required: ['user', 'reaction'],
+			},
+		},
+	},
+	users: {
+		type: 'array',
+		optional: true, nullable: true,
+		items: {
+			type: 'object',
+			ref: 'UserLite',
+			optional: false, nullable: false,
+		},
 	},
 } as const;
diff --git a/packages/backend/src/server/api/EndpointsModule.ts b/packages/backend/src/server/api/EndpointsModule.ts
index 376226be69..3f8a46d855 100644
--- a/packages/backend/src/server/api/EndpointsModule.ts
+++ b/packages/backend/src/server/api/EndpointsModule.ts
@@ -217,6 +217,7 @@ import * as ep___i_importMuting from './endpoints/i/import-muting.js';
 import * as ep___i_importUserLists from './endpoints/i/import-user-lists.js';
 import * as ep___i_importAntennas from './endpoints/i/import-antennas.js';
 import * as ep___i_notifications from './endpoints/i/notifications.js';
+import * as ep___i_notificationsGrouped from './endpoints/i/notifications-grouped.js';
 import * as ep___i_pageLikes from './endpoints/i/page-likes.js';
 import * as ep___i_pages from './endpoints/i/pages.js';
 import * as ep___i_pin from './endpoints/i/pin.js';
@@ -574,6 +575,7 @@ const $i_importMuting: Provider = { provide: 'ep:i/import-muting', useClass: ep_
 const $i_importUserLists: Provider = { provide: 'ep:i/import-user-lists', useClass: ep___i_importUserLists.default };
 const $i_importAntennas: Provider = { provide: 'ep:i/import-antennas', useClass: ep___i_importAntennas.default };
 const $i_notifications: Provider = { provide: 'ep:i/notifications', useClass: ep___i_notifications.default };
+const $i_notificationsGrouped: Provider = { provide: 'ep:i/notifications-grouped', useClass: ep___i_notificationsGrouped.default };
 const $i_pageLikes: Provider = { provide: 'ep:i/page-likes', useClass: ep___i_pageLikes.default };
 const $i_pages: Provider = { provide: 'ep:i/pages', useClass: ep___i_pages.default };
 const $i_pin: Provider = { provide: 'ep:i/pin', useClass: ep___i_pin.default };
@@ -935,6 +937,7 @@ const $retention: Provider = { provide: 'ep:retention', useClass: ep___retention
 		$i_importUserLists,
 		$i_importAntennas,
 		$i_notifications,
+		$i_notificationsGrouped,
 		$i_pageLikes,
 		$i_pages,
 		$i_pin,
@@ -1290,6 +1293,7 @@ const $retention: Provider = { provide: 'ep:retention', useClass: ep___retention
 		$i_importUserLists,
 		$i_importAntennas,
 		$i_notifications,
+		$i_notificationsGrouped,
 		$i_pageLikes,
 		$i_pages,
 		$i_pin,
diff --git a/packages/backend/src/server/api/endpoints.ts b/packages/backend/src/server/api/endpoints.ts
index 8be91469be..e87e1df591 100644
--- a/packages/backend/src/server/api/endpoints.ts
+++ b/packages/backend/src/server/api/endpoints.ts
@@ -217,6 +217,7 @@ import * as ep___i_importMuting from './endpoints/i/import-muting.js';
 import * as ep___i_importUserLists from './endpoints/i/import-user-lists.js';
 import * as ep___i_importAntennas from './endpoints/i/import-antennas.js';
 import * as ep___i_notifications from './endpoints/i/notifications.js';
+import * as ep___i_notificationsGrouped from './endpoints/i/notifications-grouped.js';
 import * as ep___i_pageLikes from './endpoints/i/page-likes.js';
 import * as ep___i_pages from './endpoints/i/pages.js';
 import * as ep___i_pin from './endpoints/i/pin.js';
@@ -572,6 +573,7 @@ const eps = [
 	['i/import-user-lists', ep___i_importUserLists],
 	['i/import-antennas', ep___i_importAntennas],
 	['i/notifications', ep___i_notifications],
+	['i/notifications-grouped', ep___i_notificationsGrouped],
 	['i/page-likes', ep___i_pageLikes],
 	['i/pages', ep___i_pages],
 	['i/pin', ep___i_pin],
diff --git a/packages/backend/src/server/api/endpoints/i/notifications-grouped.ts b/packages/backend/src/server/api/endpoints/i/notifications-grouped.ts
new file mode 100644
index 0000000000..4ea94b07f6
--- /dev/null
+++ b/packages/backend/src/server/api/endpoints/i/notifications-grouped.ts
@@ -0,0 +1,178 @@
+/*
+ * SPDX-FileCopyrightText: syuilo and other misskey contributors
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import { Brackets, In } from 'typeorm';
+import * as Redis from 'ioredis';
+import { Inject, Injectable } from '@nestjs/common';
+import type { NotesRepository } from '@/models/_.js';
+import { obsoleteNotificationTypes, notificationTypes, FilterUnionByProperty } from '@/types.js';
+import { Endpoint } from '@/server/api/endpoint-base.js';
+import { NoteReadService } from '@/core/NoteReadService.js';
+import { NotificationEntityService } from '@/core/entities/NotificationEntityService.js';
+import { NotificationService } from '@/core/NotificationService.js';
+import { DI } from '@/di-symbols.js';
+import { IdService } from '@/core/IdService.js';
+import { MiGroupedNotification, MiNotification } from '@/models/Notification.js';
+
+export const meta = {
+	tags: ['account', 'notifications'],
+
+	requireCredential: true,
+
+	limit: {
+		duration: 30000,
+		max: 30,
+	},
+
+	kind: 'read:notifications',
+
+	res: {
+		type: 'array',
+		optional: false, nullable: false,
+		items: {
+			type: 'object',
+			optional: false, nullable: false,
+			ref: 'Notification',
+		},
+	},
+} as const;
+
+export const paramDef = {
+	type: 'object',
+	properties: {
+		limit: { type: 'integer', minimum: 1, maximum: 100, default: 10 },
+		sinceId: { type: 'string', format: 'misskey:id' },
+		untilId: { type: 'string', format: 'misskey:id' },
+		markAsRead: { type: 'boolean', default: true },
+		// 後方互換のため、廃止された通知タイプも受け付ける
+		includeTypes: { type: 'array', items: {
+			type: 'string', enum: [...notificationTypes, ...obsoleteNotificationTypes],
+		} },
+		excludeTypes: { type: 'array', items: {
+			type: 'string', enum: [...notificationTypes, ...obsoleteNotificationTypes],
+		} },
+	},
+	required: [],
+} as const;
+
+@Injectable()
+export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-disable-line import/no-default-export
+	constructor(
+		@Inject(DI.redis)
+		private redisClient: Redis.Redis,
+
+		@Inject(DI.notesRepository)
+		private notesRepository: NotesRepository,
+
+		private idService: IdService,
+		private notificationEntityService: NotificationEntityService,
+		private notificationService: NotificationService,
+		private noteReadService: NoteReadService,
+	) {
+		super(meta, paramDef, async (ps, me) => {
+			const EXTRA_LIMIT = 100;
+
+			// includeTypes が空の場合はクエリしない
+			if (ps.includeTypes && ps.includeTypes.length === 0) {
+				return [];
+			}
+			// excludeTypes に全指定されている場合はクエリしない
+			if (notificationTypes.every(type => ps.excludeTypes?.includes(type))) {
+				return [];
+			}
+
+			const includeTypes = ps.includeTypes && ps.includeTypes.filter(type => !(obsoleteNotificationTypes).includes(type as any)) as typeof notificationTypes[number][];
+			const excludeTypes = ps.excludeTypes && ps.excludeTypes.filter(type => !(obsoleteNotificationTypes).includes(type as any)) as typeof notificationTypes[number][];
+
+			const limit = (ps.limit + EXTRA_LIMIT) + (ps.untilId ? 1 : 0) + (ps.sinceId ? 1 : 0); // untilIdに指定したものも含まれるため+1
+			const notificationsRes = await this.redisClient.xrevrange(
+				`notificationTimeline:${me.id}`,
+				ps.untilId ? this.idService.parse(ps.untilId).date.getTime() : '+',
+				ps.sinceId ? this.idService.parse(ps.sinceId).date.getTime() : '-',
+				'COUNT', limit);
+
+			if (notificationsRes.length === 0) {
+				return [];
+			}
+
+			let notifications = notificationsRes.map(x => JSON.parse(x[1][1])).filter(x => x.id !== ps.untilId && x !== ps.sinceId) as MiNotification[];
+
+			if (includeTypes && includeTypes.length > 0) {
+				notifications = notifications.filter(notification => includeTypes.includes(notification.type));
+			} else if (excludeTypes && excludeTypes.length > 0) {
+				notifications = notifications.filter(notification => !excludeTypes.includes(notification.type));
+			}
+
+			if (notifications.length === 0) {
+				return [];
+			}
+
+			// Mark all as read
+			if (ps.markAsRead) {
+				this.notificationService.readAllNotification(me.id);
+			}
+
+			// grouping
+			let groupedNotifications = [notifications[0]] as MiGroupedNotification[];
+			for (let i = 1; i < notifications.length; i++) {
+				const notification = notifications[i];
+				const prev = notifications[i - 1];
+				let prevGroupedNotification = groupedNotifications.at(-1)!;
+
+				if (prev.type === 'reaction' && notification.type === 'reaction' && prev.noteId === notification.noteId) {
+					if (prevGroupedNotification.type !== 'reaction:grouped') {
+						groupedNotifications[groupedNotifications.length - 1] = {
+							type: 'reaction:grouped',
+							id: '',
+							createdAt: prev.createdAt,
+							noteId: prev.noteId!,
+							reactions: [{
+								userId: prev.notifierId!,
+								reaction: prev.reaction!,
+							}],
+						};
+						prevGroupedNotification = groupedNotifications.at(-1)!;
+					}
+					(prevGroupedNotification as FilterUnionByProperty<MiGroupedNotification, 'type', 'reaction:grouped'>).reactions.push({
+						userId: notification.notifierId!,
+						reaction: notification.reaction!,
+					});
+					prevGroupedNotification.id = notification.id;
+					continue;
+				}
+				if (prev.type === 'renote' && notification.type === 'renote' && prev.targetNoteId === notification.targetNoteId) {
+					if (prevGroupedNotification.type !== 'renote:grouped') {
+						groupedNotifications[groupedNotifications.length - 1] = {
+							type: 'renote:grouped',
+							id: '',
+							createdAt: notification.createdAt,
+							noteId: prev.noteId!,
+							userIds: [prev.notifierId!],
+						};
+						prevGroupedNotification = groupedNotifications.at(-1)!;
+					}
+					(prevGroupedNotification as FilterUnionByProperty<MiGroupedNotification, 'type', 'renote:grouped'>).userIds.push(notification.notifierId!);
+					prevGroupedNotification.id = notification.id;
+					continue;
+				}
+
+				groupedNotifications.push(notification);
+			}
+
+			groupedNotifications = groupedNotifications.slice(0, ps.limit);
+
+			const noteIds = groupedNotifications
+				.filter((notification): notification is FilterUnionByProperty<MiNotification, 'type', 'mention' | 'reply' | 'quote'> => ['mention', 'reply', 'quote'].includes(notification.type))
+				.map(notification => notification.noteId!);
+
+			if (noteIds.length > 0) {
+				const notes = await this.notesRepository.findBy({ id: In(noteIds) });
+				this.noteReadService.read(me.id, notes);
+			}
+
+			return await this.notificationEntityService.packGroupedMany(groupedNotifications, me.id);
+		});
+	}
+}
diff --git a/packages/backend/src/server/api/endpoints/i/notifications.ts b/packages/backend/src/server/api/endpoints/i/notifications.ts
index 91dd72e805..039fd9454c 100644
--- a/packages/backend/src/server/api/endpoints/i/notifications.ts
+++ b/packages/backend/src/server/api/endpoints/i/notifications.ts
@@ -7,7 +7,7 @@ import { Brackets, In } from 'typeorm';
 import * as Redis from 'ioredis';
 import { Inject, Injectable } from '@nestjs/common';
 import type { NotesRepository } from '@/models/_.js';
-import { obsoleteNotificationTypes, notificationTypes } from '@/types.js';
+import { obsoleteNotificationTypes, notificationTypes, FilterUnionByProperty } from '@/types.js';
 import { Endpoint } from '@/server/api/endpoint-base.js';
 import { NoteReadService } from '@/core/NoteReadService.js';
 import { NotificationEntityService } from '@/core/entities/NotificationEntityService.js';
@@ -113,8 +113,8 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
 			}
 
 			const noteIds = notifications
-				.filter(notification => ['mention', 'reply', 'quote'].includes(notification.type))
-				.map(notification => notification.noteId!);
+				.filter((notification): notification is FilterUnionByProperty<MiNotification, 'type', 'mention' | 'reply' | 'quote'> => ['mention', 'reply', 'quote'].includes(notification.type))
+				.map(notification => notification.noteId);
 
 			if (noteIds.length > 0) {
 				const notes = await this.notesRepository.findBy({ id: In(noteIds) });
diff --git a/packages/backend/src/server/api/endpoints/notifications/create.ts b/packages/backend/src/server/api/endpoints/notifications/create.ts
index 19bc6fa8d7..7c6a979160 100644
--- a/packages/backend/src/server/api/endpoints/notifications/create.ts
+++ b/packages/backend/src/server/api/endpoints/notifications/create.ts
@@ -42,8 +42,8 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
 			this.notificationService.createNotification(user.id, 'app', {
 				appAccessTokenId: token ? token.id : null,
 				customBody: ps.body,
-				customHeader: ps.header ?? token?.name,
-				customIcon: ps.icon ?? token?.iconUrl,
+				customHeader: ps.header ?? token?.name ?? null,
+				customIcon: ps.icon ?? token?.iconUrl ?? null,
 			});
 		});
 	}
diff --git a/packages/backend/src/types.ts b/packages/backend/src/types.ts
index 69224360b3..e6dfeb6f8c 100644
--- a/packages/backend/src/types.ts
+++ b/packages/backend/src/types.ts
@@ -249,3 +249,9 @@ export type Serialized<T> = {
 					? Serialized<T[K]>
 					: T[K];
 };
+
+export type FilterUnionByProperty<
+  Union,
+  Property extends string | number | symbol,
+  Condition
+> = Union extends Record<Property, Condition> ? Union : never;
diff --git a/packages/frontend/src/components/MkNote.vue b/packages/frontend/src/components/MkNote.vue
index 57c5441bbe..d71b07c51b 100644
--- a/packages/frontend/src/components/MkNote.vue
+++ b/packages/frontend/src/components/MkNote.vue
@@ -84,7 +84,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 				</div>
 				<MkA v-if="appearNote.channel && !inChannel" :class="$style.channel" :to="`/channels/${appearNote.channel.id}`"><i class="ti ti-device-tv"></i> {{ appearNote.channel.name }}</MkA>
 			</div>
-			<MkReactionsViewer v-show="appearNote.cw == null || showContent" :note="appearNote" :maxNumber="16" @mockUpdateMyReaction="emitUpdReaction">
+			<MkReactionsViewer :note="appearNote" :maxNumber="16" @mockUpdateMyReaction="emitUpdReaction">
 				<template #more>
 					<div :class="$style.reactionOmitted">{{ i18n.ts.more }}</div>
 				</template>
diff --git a/packages/frontend/src/components/MkNotification.vue b/packages/frontend/src/components/MkNotification.vue
index c507236216..ff20bc591f 100644
--- a/packages/frontend/src/components/MkNotification.vue
+++ b/packages/frontend/src/components/MkNotification.vue
@@ -9,9 +9,11 @@ SPDX-License-Identifier: AGPL-3.0-only
 		<MkAvatar v-if="notification.type === 'pollEnded'" :class="$style.icon" :user="notification.note.user" link preview/>
 		<MkAvatar v-else-if="notification.type === 'note'" :class="$style.icon" :user="notification.note.user" link preview/>
 		<MkAvatar v-else-if="notification.type === 'achievementEarned'" :class="$style.icon" :user="$i" link preview/>
+		<div v-else-if="notification.type === 'reaction:grouped'" :class="[$style.icon, $style.icon_reactionGroup]"><i class="ti ti-plus" style="line-height: 1;"></i></div>
+		<div v-else-if="notification.type === 'renote:grouped'" :class="[$style.icon, $style.icon_renoteGroup]"><i class="ti ti-repeat" style="line-height: 1;"></i></div>
 		<img v-else-if="notification.type === 'test'" :class="$style.icon" :src="infoImageUrl"/>
 		<MkAvatar v-else-if="notification.user" :class="$style.icon" :user="notification.user" link preview/>
-		<img v-else-if="notification.icon" :class="$style.icon" :src="notification.icon" alt=""/>
+		<img v-else-if="notification.icon" :class="[$style.icon, $style.icon_app]" :src="notification.icon" alt=""/>
 		<div
 			:class="[$style.subIcon, {
 				[$style.t_follow]: notification.type === 'follow',
@@ -39,7 +41,6 @@ SPDX-License-Identifier: AGPL-3.0-only
 				v-else-if="notification.type === 'reaction'"
 				ref="reactionRef"
 				:reaction="notification.reaction ? notification.reaction.replace(/^:(\w+):$/, ':$1@.:') : notification.reaction"
-				:customEmojis="notification.note.emojis"
 				:noStyle="true"
 				style="width: 100%; height: 100%;"
 			/>
@@ -52,16 +53,18 @@ SPDX-License-Identifier: AGPL-3.0-only
 			<span v-else-if="notification.type === 'achievementEarned'">{{ i18n.ts._notification.achievementEarned }}</span>
 			<span v-else-if="notification.type === 'test'">{{ i18n.ts._notification.testNotification }}</span>
 			<MkA v-else-if="notification.user" v-user-preview="notification.user.id" :class="$style.headerName" :to="userPage(notification.user)"><MkUserName :user="notification.user"/></MkA>
+			<span v-else-if="notification.type === 'reaction:grouped'">{{ i18n.t('_notification.reactedBySomeUsers', { n: notification.reactions.length }) }}</span>
+			<span v-else-if="notification.type === 'renote:grouped'">{{ i18n.t('_notification.renotedBySomeUsers', { n: notification.users.length }) }}</span>
 			<span v-else>{{ notification.header }}</span>
 			<MkTime v-if="withTime" :time="notification.createdAt" :class="$style.headerTime"/>
 		</header>
 		<div>
-			<MkA v-if="notification.type === 'reaction'" :class="$style.text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
+			<MkA v-if="notification.type === 'reaction' || notification.type === 'reaction:grouped'" :class="$style.text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
 				<i class="ti ti-quote" :class="$style.quote"></i>
 				<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="true" :author="notification.note.user"/>
 				<i class="ti ti-quote" :class="$style.quote"></i>
 			</MkA>
-			<MkA v-else-if="notification.type === 'renote'" :class="$style.text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note.renote)">
+			<MkA v-else-if="notification.type === 'renote' || notification.type === 'renote:grouped'" :class="$style.text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note.renote)">
 				<i class="ti ti-quote" :class="$style.quote"></i>
 				<Mfm :text="getNoteSummary(notification.note.renote)" :plain="true" :nowrap="true" :author="notification.note.renote.user"/>
 				<i class="ti ti-quote" :class="$style.quote"></i>
@@ -102,6 +105,24 @@ SPDX-License-Identifier: AGPL-3.0-only
 			<span v-else-if="notification.type === 'app'" :class="$style.text">
 				<Mfm :text="notification.body" :nowrap="false"/>
 			</span>
+
+			<div v-if="notification.type === 'reaction:grouped'">
+				<div v-for="reaction of notification.reactions" :class="$style.reactionsItem">
+					<MkAvatar :class="$style.reactionsItemAvatar" :user="reaction.user" link preview/>
+					<div :class="$style.reactionsItemReaction">
+						<MkReactionIcon
+							:reaction="reaction.reaction ? reaction.reaction.replace(/^:(\w+):$/, ':$1@.:') : reaction.reaction"
+							:noStyle="true"
+							style="width: 100%; height: 100%;"
+						/>
+					</div>
+				</div>
+			</div>
+			<div v-else-if="notification.type === 'renote:grouped'">
+				<div v-for="user of notification.users" :class="$style.reactionsItem">
+					<MkAvatar :class="$style.reactionsItemAvatar" :user="user" link preview/>
+				</div>
+			</div>
 		</div>
 	</div>
 </div>
@@ -181,6 +202,29 @@ useTooltip(reactionRef, (showing) => {
 	display: block;
 	width: 100%;
 	height: 100%;
+}
+
+.icon_reactionGroup,
+.icon_renoteGroup {
+	display: grid;
+	align-items: center;
+	justify-items: center;
+	width: 80%;
+	height: 80%;
+	font-size: 15px;
+	border-radius: 100%;
+	color: #fff;
+}
+
+.icon_reactionGroup {
+	background: #e99a0b;
+}
+
+.icon_renoteGroup {
+	background: #36d298;
+}
+
+.icon_app {
 	border-radius: 6px;
 }
 
@@ -305,6 +349,36 @@ useTooltip(reactionRef, (showing) => {
 	flex: 1;
 }
 
+.reactionsItem {
+	display: inline-block;
+	position: relative;
+	width: 38px;
+	height: 38px;
+	margin-top: 8px;
+	margin-right: 8px;
+}
+
+.reactionsItemAvatar {
+	width: 100%;
+	height: 100%;
+}
+
+.reactionsItemReaction {
+	position: absolute;
+	z-index: 1;
+	bottom: -2px;
+	right: -2px;
+	width: 20px;
+	height: 20px;
+	box-sizing: border-box;
+	border-radius: 100%;
+	background: var(--panel);
+	box-shadow: 0 0 0 3px var(--panel);
+	font-size: 11px;
+	text-align: center;
+	color: #fff;
+}
+
 @container (max-width: 600px) {
 	.root {
 		padding: 16px;
diff --git a/packages/frontend/src/components/MkNotifications.vue b/packages/frontend/src/components/MkNotifications.vue
index 896f97a48d..77e66f0165 100644
--- a/packages/frontend/src/components/MkNotifications.vue
+++ b/packages/frontend/src/components/MkNotifications.vue
@@ -4,25 +4,27 @@ SPDX-License-Identifier: AGPL-3.0-only
 -->
 
 <template>
-<MkPagination ref="pagingComponent" :pagination="pagination">
-	<template #empty>
-		<div class="_fullinfo">
-			<img :src="infoImageUrl" class="_ghost"/>
-			<div>{{ i18n.ts.noNotifications }}</div>
-		</div>
-	</template>
+<MkPullToRefresh :refresher="() => reload()">
+	<MkPagination ref="pagingComponent" :pagination="pagination">
+		<template #empty>
+			<div class="_fullinfo">
+				<img :src="infoImageUrl" class="_ghost"/>
+				<div>{{ i18n.ts.noNotifications }}</div>
+			</div>
+		</template>
 
-	<template #default="{ items: notifications }">
-		<MkDateSeparatedList v-slot="{ item: notification }" :class="$style.list" :items="notifications" :noGap="true">
-			<MkNote v-if="['reply', 'quote', 'mention'].includes(notification.type)" :key="notification.id" :note="notification.note"/>
-			<XNotification v-else :key="notification.id" :notification="notification" :withTime="true" :full="true" class="_panel notification"/>
-		</MkDateSeparatedList>
-	</template>
-</MkPagination>
+		<template #default="{ items: notifications }">
+			<MkDateSeparatedList v-slot="{ item: notification }" :class="$style.list" :items="notifications" :noGap="true">
+				<MkNote v-if="['reply', 'quote', 'mention'].includes(notification.type)" :key="notification.id" :note="notification.note"/>
+				<XNotification v-else :key="notification.id" :notification="notification" :withTime="true" :full="true" class="_panel"/>
+			</MkDateSeparatedList>
+		</template>
+	</MkPagination>
+</MkPullToRefresh>
 </template>
 
 <script lang="ts" setup>
-import { onUnmounted, onDeactivated, onMounted, computed, shallowRef } from 'vue';
+import { onUnmounted, onDeactivated, onMounted, computed, shallowRef, onActivated } from 'vue';
 import MkPagination, { Paging } from '@/components/MkPagination.vue';
 import XNotification from '@/components/MkNotification.vue';
 import MkDateSeparatedList from '@/components/MkDateSeparatedList.vue';
@@ -32,6 +34,8 @@ import { $i } from '@/account.js';
 import { i18n } from '@/i18n.js';
 import { notificationTypes } from '@/const.js';
 import { infoImageUrl } from '@/instance.js';
+import { defaultStore } from '@/store.js';
+import MkPullToRefresh from '@/components/MkPullToRefresh.vue';
 
 const props = defineProps<{
 	excludeTypes?: typeof notificationTypes[number][];
@@ -39,7 +43,13 @@ const props = defineProps<{
 
 const pagingComponent = shallowRef<InstanceType<typeof MkPagination>>();
 
-const pagination: Paging = {
+const pagination: Paging = defaultStore.state.useGroupedNotifications ? {
+	endpoint: 'i/notifications-grouped' as const,
+	limit: 20,
+	params: computed(() => ({
+		excludeTypes: props.excludeTypes ?? undefined,
+	})),
+} : {
 	endpoint: 'i/notifications' as const,
 	limit: 20,
 	params: computed(() => ({
@@ -47,7 +57,7 @@ const pagination: Paging = {
 	})),
 };
 
-const onNotification = (notification) => {
+function onNotification(notification) {
 	const isMuted = props.excludeTypes ? props.excludeTypes.includes(notification.type) : false;
 	if (isMuted || document.visibilityState === 'visible') {
 		useStream().send('readNotification');
@@ -56,7 +66,15 @@ const onNotification = (notification) => {
 	if (!isMuted) {
 		pagingComponent.value.prepend(notification);
 	}
-};
+}
+
+function reload() {
+	return new Promise<void>((res) => {
+		pagingComponent.value?.reload().then(() => {
+			res();
+		});
+	});
+}
 
 let connection;
 
@@ -65,6 +83,12 @@ onMounted(() => {
 	connection.on('notification', onNotification);
 });
 
+onActivated(() => {
+	pagingComponent.value?.reload();
+	connection = useStream().useChannel('main');
+	connection.on('notification', onNotification);
+});
+
 onUnmounted(() => {
 	if (connection) connection.dispose();
 });
diff --git a/packages/frontend/src/components/MkPullToRefresh.vue b/packages/frontend/src/components/MkPullToRefresh.vue
index c38d0ff6a1..f3f5660143 100644
--- a/packages/frontend/src/components/MkPullToRefresh.vue
+++ b/packages/frontend/src/components/MkPullToRefresh.vue
@@ -47,7 +47,13 @@ let scrollEl: HTMLElement | null = null;
 
 let disabled = false;
 
-const emits = defineEmits<{
+const props = withDefaults(defineProps<{
+	refresher: () => Promise<void>;
+}>(), {
+	refresher: () => Promise.resolve(),
+});
+
+const emit = defineEmits<{
 	(ev: 'refresh'): void;
 }>();
 
@@ -120,7 +126,12 @@ function moveEnd() {
 		if (isPullEnd) {
 			isPullEnd = false;
 			isRefreshing = true;
-			fixOverContent().then(() => emits('refresh'));
+			fixOverContent().then(() => {
+				emit('refresh');
+				props.refresher().then(() => {
+					refreshFinished();
+				});
+			});
 		} else {
 			closeContent().then(() => isPullStart = false);
 		}
@@ -188,7 +199,6 @@ onUnmounted(() => {
 });
 
 defineExpose({
-	refreshFinished,
 	setDisabled,
 });
 </script>
diff --git a/packages/frontend/src/components/MkTimeline.vue b/packages/frontend/src/components/MkTimeline.vue
index a2ada35f91..845c7a414c 100644
--- a/packages/frontend/src/components/MkTimeline.vue
+++ b/packages/frontend/src/components/MkTimeline.vue
@@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 -->
 
 <template>
-<MkPullToRefresh ref="prComponent" @refresh="() => reloadTimeline(true)">
+<MkPullToRefresh ref="prComponent" :refresher="() => reloadTimeline()">
 	<MkNotes ref="tlComponent" :noGap="!defaultStore.state.showGapBetweenNotesInTimeline" :pagination="pagination" @queue="emit('queue', $event)" @status="prComponent.setDisabled($event)"/>
 </MkPullToRefresh>
 </template>
@@ -196,25 +196,18 @@ const pagination = {
 	params: query,
 };
 
-const reloadTimeline = (fromPR = false) => {
-	tlNotesCount = 0;
+function reloadTimeline() {
+	return new Promise<void>((res) => {
+		tlNotesCount = 0;
 
-	tlComponent.pagingComponent?.reload().then(() => {
-		reloadStream();
-		if (fromPR) prComponent.refreshFinished();
+		tlComponent.pagingComponent?.reload().then(() => {
+			reloadStream();
+			res();
+		});
 	});
-};
-
-//const pullRefresh = () => reloadTimeline(true);
+}
 
 defineExpose({
 	reloadTimeline,
 });
-
-/* TODO
-const timetravel = (date?: Date) => {
-	this.date = date;
-	this.$refs.tl.reload();
-};
-*/
 </script>
diff --git a/packages/frontend/src/pages/about.federation.vue b/packages/frontend/src/pages/about.federation.vue
index 333af93ef8..47fe9c4279 100644
--- a/packages/frontend/src/pages/about.federation.vue
+++ b/packages/frontend/src/pages/about.federation.vue
@@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 -->
 
 <template>
-<div>
+<div class="_gaps">
 	<div>
 		<MkInput v-model="host" :debounce="true" class="">
 			<template #prefix><i class="ti ti-search"></i></template>
diff --git a/packages/frontend/src/pages/settings/general.vue b/packages/frontend/src/pages/settings/general.vue
index 85d038e3d1..d96c984688 100644
--- a/packages/frontend/src/pages/settings/general.vue
+++ b/packages/frontend/src/pages/settings/general.vue
@@ -88,6 +88,8 @@ SPDX-License-Identifier: AGPL-3.0-only
 		<template #label>{{ i18n.ts.notificationDisplay }}</template>
 
 		<div class="_gaps_m">
+			<MkSwitch v-model="useGroupedNotifications">{{ i18n.ts.useGroupedNotifications }}</MkSwitch>
+
 			<MkRadios v-model="notificationPosition">
 				<template #label>{{ i18n.ts.position }}</template>
 				<option value="leftTop"><i class="ti ti-align-box-left-top"></i> {{ i18n.ts.leftTop }}</option>
@@ -255,6 +257,7 @@ const notificationStackAxis = computed(defaultStore.makeGetterSetter('notificati
 const keepScreenOn = computed(defaultStore.makeGetterSetter('keepScreenOn'));
 const defaultWithReplies = computed(defaultStore.makeGetterSetter('defaultWithReplies'));
 const disableStreamingTimeline = computed(defaultStore.makeGetterSetter('disableStreamingTimeline'));
+const useGroupedNotifications = computed(defaultStore.makeGetterSetter('useGroupedNotifications'));
 
 watch(lang, () => {
 	miLocalStorage.setItem('lang', lang.value as string);
diff --git a/packages/frontend/src/store.ts b/packages/frontend/src/store.ts
index 8922d29bfe..7f916656de 100644
--- a/packages/frontend/src/store.ts
+++ b/packages/frontend/src/store.ts
@@ -378,6 +378,10 @@ export const defaultStore = markRaw(new Storage('base', {
 		where: 'device',
 		default: false,
 	},
+	useGroupedNotifications: {
+		where: 'device',
+		default: true,
+	},
 }));
 
 // TODO: 他のタブと永続化されたstateを同期